术语和定义
在本部分文档中，我们将解释一些基本的 React Flow 术语和定义。在 React Flow 中，您将经常使用三个东西：节点、边和把手。
节点
React Flow 中的节点是一个 React 组件。这意味着它可以渲染您喜欢的任何内容。每个节点都有一个 x 坐标和 y 坐标，指示它在视窗中的位置。默认情况下，节点看起来像上面的示例。您可以在 节点选项 文档中找到自定义节点的所有选项。
自定义节点
这就是 React Flow 的魔力所在。您可以自定义节点的外观和行为，使其符合您的需求。您可能创建的大部分功能都不是 React Flow 的内置功能。您可以使用自定义节点执行的一些操作包括
- 渲染表单元素
- 可视化数据
- 支持多个把手
有关更多信息，请参阅 自定义节点文档。
把手
把手（在其他库中也称为“端口”）是边连接到节点的位置。把手可以放置在任何位置，并根据您的喜好进行样式设置。它只是一个 div 元素。默认情况下，它显示为节点顶部、底部、左侧或右侧的灰色圆圈。创建自定义节点时，您可以在节点中使用任意数量的把手。有关更多信息，请参阅 把手文档。
边
边连接两个节点。每条边都需要一个目标节点和一个源节点。React Flow 附带四种内置的 边类型：默认（贝塞尔曲线）、平滑过渡、阶梯和直线。边是可以用 CSS 设置样式的 SVG 路径，并且可以完全自定义。如果您使用多个把手，则可以单独引用它们以创建节点的多个连接。
自定义边
与自定义节点一样，您也可以自定义边。人们使用自定义边做的事情包括
- 添加一个按钮以删除边
- 自定义路由行为
- 无法仅使用一个 SVG 路径解决的复杂样式或交互
您可以在 自定义边 API 网站上找到更多信息。
连接线
React Flow 具有内置的功能，可以从一个把手单击并拖动到另一个把手，以创建新的边。拖动时，占位符边称为连接线。连接线还具有四种内置类型，并且可以自定义。您可以在 属性部分 中找到用于配置连接线的属性。
视窗
所有 React Flow 都存在于视窗内。视窗具有 x、y 和缩放值。拖动窗格时，会更改 x 和 y 坐标；放大或缩小时，会更改缩放级别。