API 参考
此参考试图记录 React Flow 导出的每个函数、hook、组件和类型。如果您正在寻找指南和教程,请参阅我们的 学习部分.
如何使用此参考
我们认为文档应该回答两个广泛的问题:“这是什么?” 和“我如何使用它?”
为此,我们的 API 参考旨在**简洁地**回答第一个问题,学习部分则详细介绍第二个问题。如果您发现自己在参考中点击来点击去,却不知道这些东西到底是什么,也许我们有一份指南可以帮助您!
自定义节点
React Flow 的一个强大功能是能够添加自定义节点。在您的自定义节点中,您可以渲染您想要的任何内容。您可以定义多个源和目标处理程序,并渲染表单输入或图表等。在本指南中,我们将实现一个带有输入字段的节点,该字段会更新应用程序其他部分的文本。
阅读更多布局
我们经常被问到如何在 React Flow 中处理布局。虽然我们可以在 React Flow 中构建一些基本布局,但我们认为您最了解应用程序的要求,并且有如此多的选项,我们认为您最好选择适合工作的工具。在本指南中,我们将研究四个布局库以及如何使用它们。
阅读更多给长期用户的提示
如果您是从我们的旧 API 页面到这里,您可能会发现有些地方看起来不太一样!我们已经重新组织了我们的文档,使您更容易查找所需内容。现在,我们所有的类型、组件、hook 和工具函数都有自己的页面,以帮助您找到所需内容。
如果您是 React Flow 的新手,或者不确定在哪里查找某个东西,请查看下面的部分。
给 JavaScript 用户的提示
React Flow 是用 TypeScript 编写的,但我们知道并非所有人都使用它。我们鼓励开发人员使用最适合他们的技术,并且在我们的所有文档中都混合了 TypeScript 和 JavaScript 示例。
但是,对于我们的 API 参考,我们使用 TypeScript 的语法来记录 props 和函数的类型。以下是如何快速阅读它的简要说明
• ?
表示字段或参数是可选的。
• 类型定义中的 <T>
表示泛型类型参数。就像函数参数,但对于类型!定义 type Array<T> = ...
表示名为 Array
的类型,它接受泛型类型参数 T
。
• 引用类型时的 <T>
就像“填充”泛型类型参数。就像调用函数,但对于类型!类型 Array<number>
是用类型 number
填充泛型类型参数 T
的类型 Array
。
• T | U
表示该类型是 T
或 U
:这通常称为并集。
• T & U
表示该类型同时是 T
和 U
:这通常称为交集。
TypeScript 小组有他们自己的 方便的类型阅读指南,您可能会觉得有用。如果您仍然卡在某些地方,请随时访问我们的 Discord 并寻求帮助!