useNodes()

GitHub上的源代码 

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

🌐 This hook returns an array of the current nodes. Components that use this hook will re-render whenever any node changes, including when a node is selected or moved.

import { useNodes } from '@xyflow/react';
 
export default function () {
  const nodes = useNodes();
 
  return <div>There are currently {nodes.length} nodes!</div>;
}

签名

🌐 Signature

This function does not accept any parameters.

TypeScript

这个钩子接受自定义节点类型的泛型类型参数。有关更多信息，请参见我们 TypeScript 指南中的这一部分。

🌐 This hook accepts a generic type argument of custom node types. See this section in our TypeScript guide for more information.

const nodes = useNodes<CustomNodeType>();

注释

🌐 Notes

• 不必要地依赖 useNodes 通常是性能问题的常见原因。每当任何节点发生变化时，这个钩子都会导致组件重新渲染。通常我们实际上更关心一些更具体的情况，比如节点的数量发生变化：在可能的情况下，尽量使用 useStore 代替。