@@ -82,23 +82,23 @@ removeNodes('1')
82
82
</script>
83
83
```
84
84
85
- ## The ` applyChanges ` option
85
+ ## The ` applyDefault ` option
86
86
87
- The ` applyChanges ` option is a prop that can be passed to the ` <VueFlow> ` component to enable or disable automatic change handling.
87
+ The ` applyDefault ` option is a prop that can be passed to the ` <VueFlow> ` component to enable or disable automatic change handling.
88
88
89
89
By setting this option to ` false ` , we tell Vue Flow to not apply changes automatically anymore,
90
90
that way we can take control of changes and apply them manually.
91
91
92
92
``` vue
93
93
<template>
94
- <VueFlow :nodes="nodes" :edges="edges" :apply-changes ="false" />
94
+ <VueFlow :nodes="nodes" :edges="edges" :apply-default ="false" />
95
95
</template>
96
96
```
97
97
98
98
## ` onNodesChange ` / ` onEdgesChange ` events
99
99
100
100
Vue Flow provides two events that can be used to listen to changes on nodes and edges.
101
- These events are emitted regardless of the ` applyChanges ` option, so you can use them to listen to changes even if you have automatic changes enabled.
101
+ These events are emitted regardless of the ` applyDefault ` option, so you can use them to listen to changes even if you have automatic changes enabled.
102
102
103
103
``` vue
104
104
<script setup>
@@ -150,7 +150,7 @@ const onChange = (changes) => {
150
150
151
151
Using what we just learned, we can now take control of changes and apply them manually.
152
152
153
- In this example, we will first disable automatic change handlers with ` applyChanges ` ,
153
+ In this example, we will first disable automatic change handlers with ` applyDefault ` ,
154
154
then use the ` onNodesChange ` event to listen to changes and validate delete changes and,
155
155
if they are valid, use ` applyNodeChanges ` to apply them.
156
156
0 commit comments