useConnection()

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

¥The useConnection hook returns the current connection state when there is an active connection interaction. If no connection interaction is active, it returns null for every property. A typical use case for this hook is to colorize handles based on a certain condition (e.g. if the connection is valid or not).


import { useConnection } from '@xyflow/react';
 
export default function App() {
  const connection = useConnection();
 
  return (
    <div>
      {connection ? `Someone is trying to make a connection from ${connection.fromNode} to this one.` : 'There are currently no incoming connections!'}
    </div>
  );
}

签名

¥Signature

Name	Type
#Params
#`selector?`	`(connection: ConnectionState<InternalNode<NodeType>>) => T` An optional selector function used to extract a slice of the ConnectionState data. Using a selector can prevent component re-renders where data you don't otherwise care about might change. If a selector is not provided, the entire ConnectionState object is returned unchanged.
#Returns
#	`T`