フック
useConnection
useConnection フックは、アクティブな接続インタラクションがある場合、現在の接続を返します。接続インタラクションがアクティブでない場合、すべてのプロパティに対して null を返します。このフックの典型的なユースケースは、特定の条件（例えば、接続が有効かどうか）に基づいてハンドルを着色することです。
続きを読むuseEdges
このフックは、現在のエッジの配列を返します。このフックを使用するコンポーネントは、エッジが変更されるたびに再レンダリングされます。
続きを読むuseEdgesState
このフックを使用すると、ノードとエッジの状態を ReactFlowInstance の外部で管理する制御フローのプロトタイプを簡単に作成できます。React の useState フックのようなもので、追加のヘルパーコールバックがあります。
useHandleConnections()
このフックは、現在のエッジの配列を返します。このフックを使用するコンポーネントは、エッジが変更されるたびに再レンダリングされます。
続きを読むuseKeyPress
このフックを使用すると、特定のキーコードをリッスンし、現在押されているかどうかを確認できます。
続きを読むuseNodeId
このフックを使用して、使用されているノードの ID を取得できます。レンダーツリーの奥深くでノードの ID が必要な場合に、ID を小道具として手動でドリルダウンしたくない場合に便利です。
続きを読むuseNodes
このフックは、現在のノードの配列を返します。このフックを使用するコンポーネントは、ノードが選択または移動された場合を含め、ノードが変更されるたびに再レンダリングされます。
続きを読むuseInternalNode
このフックは、指定されたノード ID の InternalNode オブジェクトを返します。
続きを読むuseNodesData()
このフックを使用すると、特定のノードのノードデータの変更を購読できます。
続きを読むuseNodesInitialized
このフックは、フロー内のすべてのノードが測定され、幅と高さが指定されているかどうかを示します。フローにノードを追加すると、このフックは false を返し、ノードが測定されると再び true を返します。
続きを読むuseNodesState
このフックを使用すると、ノードとエッジの状態を ReactFlowInstance の外部で管理する制御フローのプロトタイプを簡単に作成できます。React の useState フックのようなもので、追加のヘルパーコールバックがあります。
useOnSelectionChange
このフックを使用すると、ノードとエッジの両方の選択の変更をリッスンできます。名前が示すように、指定したコールバックは、ノードまたはエッジの選択が変更されるたびに呼び出されます。
続きを読むuseOnViewportChange
useOnViewportChange フックを使用すると、パンやズームなどのビューポートの変更をリッスンできます。ビューポート変更の各フェーズ（onStart、onChange、onEnd）にコールバックを提供できます。
続きを読むuseReactFlow
このフックは、ノードとエッジの更新、ビューポートの操作、またはフローの現在の状態のクエリに使用できる ReactFlowInstance を返します。
続きを読むuseStore
このフックは、React Flow コンポーネントの内部状態の変更を購読するために使用できます。 useStore フックは Zustand 状態管理ライブラリから再エクスポートされるため、詳細については、そのドキュメントを確認する必要があります。
続きを読むuseStoreApi
場合によっては、ストアに直接アクセスする必要がある場合があります。このフックは、状態にアクセスしたり、アクションをディスパッチしたりするためにオンデマンドで使用できるストアオブジェクトを返します。
続きを読むuseUpdateNodeInternals
ノードにハンドルをプログラムで追加または削除したり、ノードのハンドル位置を更新したりする場合は、このフックを使用して React Flow に通知する必要があります。これにより、ノードの内部ディメンションが更新され、必要に応じてキャンバス上のハンドルが適切に再配置されます。
続きを読むuseViewport
useViewport フックは、コンポーネント内の Viewport の現在の状態を読み取るための便利な方法です。このフックを使用するコンポーネントは、ビューポートが変更されるたびに再レンダリングされます。
続きを読む