跳至主要內容

控制 Vue 流程

LincZero大约 1 分钟

控制 Vue 流程

Warning

此 API 可能会在下一个主要版本中发生变化,届时将不再自动应用更改。

默认情况下,Vue Flow 会自动应用_更改_,因此您不必担心。

不过,在某些情况下,您希望控制更改并在经过一些处理和验证之后手动应用它们。

在本指南中,我们将学习如何控制更改并手动应用它们。

什么是变化open in new window

更改是通过与流的交互触发的任何事物,例如添加、更新(位置、选择)或删除节点或边(通过拖动、单击等,或通过使用提供的 API)。

onNodesChange这些变化通过和事件传达给用户空间onEdgesChange

可能的变化包括:

Warning

变化_并不是_指流程中的_任何_data变化,例如缩放或平移,或者仅仅更新节点的对象。

为什么我更新节点时没有发出任何变化?open in new window

Vue Flow 不会跟踪您的节点/边并尝试找出发生了什么变化,它只会在您与流交互或使用 API 时发出变化。

例如这不会发出变化:

……

选择applyDefault

onNodesChange/onEdgesChange活动

applyNodeChanges/applyEdgeChanges

验证变更