钩子

¥Hooks

useConnection()

当存在活动连接交互时，useConnection 钩子会返回当前连接。如果没有活动的连接交互，它将为每个属性返回 null。此钩子的典型用例是根据特定条件（例如，连接是否有效）为句柄着色。

此钩子返回当前边缘的数组。使用此钩子的组件将在任何边缘发生变化时重新渲染。

此钩子可让你轻松地原型化受控流，你可以在其中管理 ReactFlowInstance 之外的节点和边缘的状态。你可以将其视为带有附加辅助回调的 React 的 `useState` 钩子。

此钩子返回当前边缘的数组。使用此钩子的组件将在任何边缘发生变化时重新渲染。

此钩子返回给定节点 ID 的 InternalNode 对象。

此钩子可让你监听特定的键代码并告诉你它们当前是否被按下。

此钩子返回连接边的数组。使用此钩子的组件将在任何边缘发生变化时重新渲染。

你可以使用此钩子获取它内部使用的节点的 ID。如果你需要节点的 id 在渲染树中更深，但又不想手动将 id 作为 prop 向下钻取，则它很有用。

此钩子返回当前节点的数组。使用此钩子的组件将在任何节点发生变化时重新渲染，包括选择或移动节点时。

使用此钩子，你可以订阅特定节点的节点数据更改。

此钩子告诉你流中的所有节点是否都已测量并指定了宽度和高度。将节点添加到流时，此钩子将返回 false，然后在测量节点后再次返回 true。

此钩子可让你监听节点和边缘选择的变化。顾名思义，只要节点或边的选择发生变化，就会调用你提供的回调。

useOnViewportChange 钩子可让你监听视口的更改，例如平移和缩放。你可以为视口更改的每个阶段提供回调：onStart、onChange 和 onEnd。

此钩子返回一个 ReactFlowInstance，可用于更新节点和边缘、操作视口或查询流的当前状态。

此钩子可用于订阅 React Flow 组件的内部状态更改。useStore 钩子从 Zustand 状态管理库重新导出，因此你应该查看其文档以了解更多详细信息。

在某些情况下，你可能需要直接访问存储。此钩子返回存储对象，可根据需要使用该对象来访问状态或分派操作。

以编程方式添加或删除节点的句柄或更新节点的句柄位置时，你需要使用此钩子让 React Flow 知道这一点。这将更新节点的内部尺寸，并在必要时正确重新定位画布上的句柄。

useViewport 钩子是一种读取组件中视口当前状态的便捷方法。使用此钩子的组件将在视口更改时重新渲染。