ReferenceHooks

useNodeConnections

Source on GitHub

This hook returns an array of connections on a specific node, handle type (‘source’, ‘target’) or handle ID.

import { useNodeConnections } from '@xyflow/react';
 
export default function () {
  const connections = useNodeConnections({
    type: 'target',
    handleId: 'my-handle',
  });
 
  return (
    <div>There are currently {connections.length} incoming connections!</div>
  );
}

Signature

#Params
#type?
"source" | "target"
What type of handle connections do you want to observer?
#handleId?
string
ID of the handle
#nodeId?
string
ID of the node, filled in automatically if used inside custom node
#onConnect?
(connections: Connection[]) => void
#onDisconnect?
(connections: Connection[]) => void
#Returns
NodeConnection[]