reactflow 節(jié)點(diǎn)分3種

1. Nodes，節(jié)點(diǎn)

2. Edges，連線，邊

3. Handle 手柄

Handle 手柄

<Handle />

EdgeLabelRenderer

NodeToolbar 節(jié)點(diǎn)工具欄

<NodeToolbar /> 節(jié)點(diǎn)工具欄

NodeResizer 縮放節(jié)點(diǎn)

<NodeResizer /> 縮放節(jié)點(diǎn)NodeResizeControl 自定義縮放節(jié)點(diǎn)

Component 輔助組件

Background

<Background /> 背景可以設(shè)置多個背景組合在一起

dots 小點(diǎn)點(diǎn)

lines 方格

corss 十字星

Controls

<Controls /> 控制器

MiniMap

<MiniMap /> 縮略圖

Panel

<Panel /> 面板，幫助器組件

Controls 控制器MiniMap 迷你地圖Background 背景網(wǎng)格

nodes節(jié)點(diǎn)操作

connectEnd 創(chuàng)建節(jié)點(diǎn)

適用場景，Treehttps://reactflow.dev/docs/examples/nodes/add-node-on-edge-drop

更新節(jié)點(diǎn)信息

https://reactflow.dev/docs/examples/nodes/update-node

自定義節(jié)點(diǎn)

https://reactflow.dev/docs/examples/nodes/custom-node/

縮放節(jié)點(diǎn)

https://reactflow.dev/docs/examples/nodes/node-resizer/

旋轉(zhuǎn)節(jié)點(diǎn)

https://reactflow.dev/docs/examples/nodes/resize-rotate/

delete刪除節(jié)點(diǎn)

https://reactflow.dev/docs/examples/nodes/delete-middle-node/

group分組

https://reactflow.dev/docs/examples/nodes/dynamic-grouping/

shapes 自定義形狀

https://reactflow.dev/docs/examples/nodes/shapes/