連線事件

在連線過程中，React Flow 會發出不同的事件，您可以使用這些事件以不同的方式更新您的 UI 或流程。以下範例示範了哪些事件會被觸發以及觸發時間。

export default function App() {
  const data: string = "world"

  return <h1>Hello {data}</h1>
}

對於從控制點拖曳建立的新連線，會依序呼叫以下事件

• onConnectStart 會在滑鼠事件和包含來源節點、潛在的來源控制點 ID 和控制點類型的物件中呼叫。

• onConnect 只有在連線釋放在可連線的控制點上時才會呼叫。它會在包含來源和目標節點，以及來源和目標控制點 ID（如果有的話）的完整連線物件中呼叫。

• onConnectEnd 會在釋放連線時呼叫，無論是否成功。它會在滑鼠事件中呼叫。

當透過拖曳現有邊緣重新連線邊緣時，會依序呼叫以下事件

• onReconnectStart 會在拿起可重新連線的邊緣時呼叫。它會在滑鼠事件、正在重新連線的邊緣物件和穩定控制點的類型中呼叫。

• onConnectStart 如上所述呼叫。

• onReconnect 會在邊緣釋放在可重新連線的控制點上時呼叫。它會在舊的邊緣物件和新的連線物件中呼叫。

• onConnectEnd 如上所述呼叫。

• onReconnectEnd 會在釋放邊緣時呼叫，無論重新連線是否成功。它會在滑鼠事件、拿起的邊緣和穩定控制點的類型中呼叫。