docs: add typedoc links and fix edge docs
This commit is contained in:
bcakmakoglu
@@ -14,7 +14,7 @@ To use the background simply pass the `Background` component as a child to the `
|
||||
</template>
|
||||
```
|
||||
|
||||
## Props
|
||||
## [Props](/typedocs/interfaces/BackgroundProps.html/)
|
||||
|
||||
| Name | Definition | Type | Optional | Default |
|
||||
|--------------|-------------------|--------------------------------------------------------------|----------|---------|
|
||||
|
||||
@@ -14,7 +14,7 @@ To use the controls simply pass the `Controls` component as a child to the `VueF
|
||||
</template>
|
||||
```
|
||||
|
||||
## Props
|
||||
## [Props](/typedocs/interfaces/ControlProps.html/)
|
||||
|
||||
| Name | Definition | Type | Optional | Default |
|
||||
|-----------------|---------------------------|------------------------------------------------------|----------|---------|
|
||||
|
||||
@@ -19,7 +19,7 @@ To use the component pass the `MiniMapNode` as a child to the [`MiniMap`](/guide
|
||||
</template>
|
||||
```
|
||||
|
||||
## Props
|
||||
## [Props](/typedocs/interfaces/MiniMapNodeProps.html/)
|
||||
|
||||
| Name | Definition | Type | Optional | Default |
|
||||
|----------------|---------------------------------|-----------------------------------------------------|----------|---------|
|
||||
|
||||
@@ -12,7 +12,7 @@ To use the minimap simply pass the `MiniMap` component as a child to the `VueFlo
|
||||
</template>
|
||||
```
|
||||
|
||||
## Props
|
||||
## [Props](/typedocs/interfaces/MiniMapProps.html/)
|
||||
|
||||
| Name | Definition | Type | Optional | Default |
|
||||
|------------------|--------------------------|------------------------------------------------------------------|----------|-------------------------|
|
||||
|
||||
+15
-16
@@ -54,10 +54,10 @@ export default defineComponent({
|
||||
</template>
|
||||
```
|
||||
|
||||
For more
|
||||
advanced graphs that require more state access you will want to use the useVueFlow composable. UseVueFlow will provide
|
||||
you with an
|
||||
`addNodes` utility function, which you can use to add nodes directly to the state.
|
||||
For more advanced graphs that require more state access you will want to use the useVueFlow composable.
|
||||
[useVueFlow](/typedocs/functions/useVueFlow.html/) will provide
|
||||
you with an [`addEdges`](/typedocs/interfaces/Actions.html#addedges/) utility function, which you can use to add edges
|
||||
directly to the state.
|
||||
|
||||
```vue:no-line-numbers
|
||||
<script setup>
|
||||
@@ -98,15 +98,14 @@ onMounted(() => {
|
||||
</template>
|
||||
```
|
||||
|
||||
You can also apply changes (like removing elements safely) using the `applyEdgeChanges` utility function, which expects an array of changes to be
|
||||
applied to the currently stored edges.
|
||||
You can also apply changes (like removing elements safely) using
|
||||
the [`applyEdgeChanges`](/typedocs/interfaces/Actions.html#applyedgechanges/) utility function, which expects an array
|
||||
of [changes](/typedocs/types/EdgeChange.html/) to be applied to the currently stored edges.
|
||||
|
||||
## Default Edge-Types
|
||||
## [Default Edge-Types](typedocs/types/DefaultEdgeTypes.html/)
|
||||
|
||||
Vue Flow comes with built-in nodes that you can use right out of the box.
|
||||
These node types include `default`, `input` and `output`.
|
||||
|
||||
You can set a label on each of these types.
|
||||
Vue Flow comes with built-in edges that you can use right out of the box.
|
||||
These edge types include `default` (bezier), `step`, `smoothstep` and `straight`.
|
||||
|
||||
### Default Edge (Bezier)
|
||||
|
||||
@@ -231,10 +230,12 @@ const elements = ref([
|
||||
|
||||
### Edge-types object
|
||||
|
||||
You can also define edge-types by passing an object as a prop to the VueFlow component (or as an option to the composable).
|
||||
You can also define edge-types by passing an object as a prop to the VueFlow component (or as an option to the
|
||||
composable).
|
||||
|
||||
::: warning
|
||||
When doing this, mark your components as raw (using the designated function from the vue library) to avoid them being turned into reactive objects.
|
||||
When doing this, mark your components as raw (using the designated function from the vue library) to avoid them being
|
||||
turned into reactive objects.
|
||||
Otherwise, vue will throw a warning in the console.
|
||||
:::
|
||||
|
||||
@@ -317,7 +318,7 @@ const elements = ref([
|
||||
</template>
|
||||
```
|
||||
|
||||
### Custom Edge Props
|
||||
### [Custom Edge Props](/typedocs/interfaces/EdgeProps.html/)
|
||||
|
||||
Your custom edges are wrapped so that the basic functions like selecting work.
|
||||
But you might want to extend on that functionality or implement your own business logic inside of edges, therefore
|
||||
@@ -351,5 +352,3 @@ your edges receive the following props:
|
||||
| markerStart | Edge marker | string | true |
|
||||
| markerEnd | Edge marker | string | true |
|
||||
| curvature | Edge path curvature | number | true |
|
||||
|
||||
You can find the full description [here](/typedocs/interfaces/EdgeProps.html/).
|
||||
|
||||
+15
-17
@@ -50,10 +50,10 @@ export default defineComponent({
|
||||
</template>
|
||||
```
|
||||
|
||||
For more
|
||||
advanced graphs that require more state access you will want to use the useVueFlow composable. UseVueFlow will provide
|
||||
you with an
|
||||
`addNodes` utility function, which you can use to add nodes directly to the state.
|
||||
For more advanced graphs that require more state access you will want to use the useVueFlow composable.
|
||||
[useVueFlow](/typedocs/functions/useVueFlow.html/) will provide
|
||||
you with an [`addNodes`](/typedocs/interfaces/Actions.html#addnodes/) utility function, which you can use to add nodes
|
||||
directly to the state.
|
||||
|
||||
```vue:no-line-numbers
|
||||
<script setup>
|
||||
@@ -88,8 +88,8 @@ onMounted(() => {
|
||||
</template>
|
||||
```
|
||||
|
||||
You can also apply changes (like removing elements safely) using the `applyNodeChanges` utility function, which expects an array of changes to be
|
||||
applied to the currently stored nodes.
|
||||
You can also apply changes using the [`applyNodeChanges`](/typedocs/interfaces/Actions.html#applynodechanges/) utility function,
|
||||
which expects an array of [changes](/typedocs/types/NodeChange.html/) to be applied to the currently stored nodes.
|
||||
|
||||
```vue:no-line-numbers
|
||||
<script setup>
|
||||
@@ -123,13 +123,11 @@ onMounted(() => {
|
||||
</template>
|
||||
```
|
||||
|
||||
## Default Node-Types
|
||||
## [Default Node-Types](/typedocs/types/DefaultNodeTypes.html/)
|
||||
|
||||
Vue Flow comes with built-in nodes that you can use right out of the box.
|
||||
These node types include `default`, `input` and `output`.
|
||||
|
||||
You can set a label on each of these types.
|
||||
|
||||
### Default Node
|
||||
|
||||
|
||||
@@ -224,10 +222,12 @@ const elements = ref([
|
||||
|
||||
### Node-types object
|
||||
|
||||
You can also define node-types by passing an object as a prop to the VueFlow component (or as an option to the composable).
|
||||
You can also define node-types by passing an object as a prop to the VueFlow component (or as an option to the
|
||||
composable).
|
||||
|
||||
::: warning
|
||||
When doing this, mark your components as raw (using the designated function from the vue library) to avoid them being turned into reactive objects.
|
||||
When doing this, mark your components as raw (using the designated function from the vue library) to avoid them being
|
||||
turned into reactive objects.
|
||||
Otherwise, vue will throw a warning in the console.
|
||||
:::
|
||||
|
||||
@@ -263,7 +263,7 @@ const elements = ref([
|
||||
```
|
||||
|
||||
::: tip
|
||||
You can find a more advanced example [here](/examples/custom-node.html).
|
||||
You can find a more advanced example [here](/examples/custom-node.html/).
|
||||
:::
|
||||
|
||||
### Node Template
|
||||
@@ -304,7 +304,7 @@ const elements = ref([
|
||||
</template>
|
||||
```
|
||||
|
||||
### Custom Node Props
|
||||
### [(Custom) Node Props](/typedocs/interfaces/NodeProps.html/)
|
||||
|
||||
Your custom nodes are wrapped so that the basic functions like dragging or selecting work.
|
||||
But you might want to extend on that functionality or implement your own business logic inside of nodes, therefore
|
||||
@@ -331,9 +331,6 @@ your nodes receive the following props:
|
||||
| sourcePosition | Source handle position | Position | true |
|
||||
| dragHandle | Node drag handle class | string | true |
|
||||
|
||||
|
||||
You can find the full description [here](/typedocs/interfaces/NodeProps.html/).
|
||||
|
||||
## Styling
|
||||
|
||||
::: tip
|
||||
@@ -354,6 +351,7 @@ When you create a new node type you also need to implement some styling. Your cu
|
||||
|
||||
### Allow scrolling inside a node
|
||||
|
||||
You can use the `noWheelClassName` prop to define a class which will prevent zoom-on-scroll or pan-on-scroll behavior on that element.
|
||||
You can use the `noWheelClassName` prop to define a class which will prevent zoom-on-scroll or pan-on-scroll behavior on
|
||||
that element.
|
||||
By default the `noWheelClassName` is `.nowheel`.
|
||||
By adding this class you can also enable scrolling inside a node.
|
||||
|
||||
@@ -72,7 +72,7 @@ const nodes = ref<Node[]>([
|
||||
])
|
||||
```
|
||||
|
||||
### Using CSS variables
|
||||
### [Using CSS variables](typedocs/types/CSSVars.html/)
|
||||
|
||||
Some theme stylings can be overwritten by using css variables.
|
||||
These variables can either be applied globally or you can define them on an element basis.
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
# Graph
|
||||
|
||||
### isEdge
|
||||
### [isEdge](/typedocs/functions/isEdge.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
@@ -34,7 +34,7 @@ const toggleClass = () => {
|
||||
</template>
|
||||
```
|
||||
|
||||
### isNode
|
||||
### [isNode](/typedocs/functions/isNode.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
@@ -68,10 +68,11 @@ const toggleClass = () => {
|
||||
</template>
|
||||
```
|
||||
|
||||
### addEdge
|
||||
### [addEdge](/typedocs/functions/isEdge.html/)
|
||||
|
||||
::: warning
|
||||
When using composition you should access `addEdges` from `useVueFlow`
|
||||
In the composition API you should use [`addEdges`](/typedocs/types/AddEdges.html/)
|
||||
of [`useVueFlow`](/guide/composables.html#usevueflow/)
|
||||
:::
|
||||
|
||||
- Details:
|
||||
@@ -100,10 +101,11 @@ const onConnect = (params) => {
|
||||
</template>
|
||||
```
|
||||
|
||||
### updateEdge
|
||||
### [updateEdge](/typedocs/functions/updateEdge.html)
|
||||
|
||||
::: warning
|
||||
When using composition you should access `updateEdge` from `useVueFlow`
|
||||
In the composition API you use access [`updateEdge`](/typedocs/types/UpdateEdge.html)
|
||||
of [`useVueFlow`](/guide/composables.html#usevueflow/)
|
||||
:::
|
||||
|
||||
- Details:
|
||||
@@ -132,31 +134,31 @@ const onEdgeUpdate = ({ edge, connection }) => {
|
||||
</template>
|
||||
```
|
||||
|
||||
### getOutgoers
|
||||
### [getOutgoers](/typedocs/functions/getOutgoers.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns all target elements of a node.
|
||||
|
||||
### getIncomers
|
||||
### [getIncomers](/typedocs/functions/getIncomers.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns all source elements of a node.
|
||||
|
||||
### getConnectedEdges
|
||||
### [getConnectedEdges](/typedocs/functions/getConnectedEdges.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns all connected edges of a node.
|
||||
|
||||
### getTransformForBounds
|
||||
### [getTransformForBounds](/typedocs/functions/getTransformForBounds.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns a transformation for the viewport according to input bounds.
|
||||
|
||||
### getRectOfNodes
|
||||
### [getRectOfNodes](/typedocs/functions/getRectOfNodes.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
@@ -164,13 +166,13 @@ const onEdgeUpdate = ({ edge, connection }) => {
|
||||
|
||||
Useful when you need to know the boundaries of a set of nodes.
|
||||
|
||||
### getNodesInside
|
||||
### [getNodesInside](/typedocs/functions/getNodesInside.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns node elements that are inside a specified rect.
|
||||
|
||||
### getMarkerId
|
||||
### [getMarkerId](/typedocs/functions/getMarkerId.html/)
|
||||
|
||||
- Details:
|
||||
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
# Viewport Functions
|
||||
|
||||
Viewport Functions can be accessed via the `useVueFlow` utility or with the `VueFlowStore` instance provided by
|
||||
`onPaneReady`.
|
||||
Viewport Functions can be accessed via the [`useVueFlow`](/guide/composables.html#usevueflow/)
|
||||
utility or with the [`VueFlowStore`](/typedocs/types/VueFlowStore.html/)
|
||||
instance provided by [`onPaneReady`](/typedocs/interfaces/FlowEvents.html#paneready/).
|
||||
|
||||
<CodeGroup>
|
||||
<CodeGroupItem title="Composition API" active>
|
||||
@@ -45,6 +46,7 @@ export default defineComponent({
|
||||
<VueFlow @pane-ready="onPaneReady" />
|
||||
</template>
|
||||
```
|
||||
|
||||
</CodeGroupItem>
|
||||
</CodeGroup>
|
||||
|
||||
@@ -112,7 +114,6 @@ vueFlowInstance.setTransform({ x: 100, y: 100, zoom: 1.5 })
|
||||
|
||||
Zooms in.
|
||||
|
||||
|
||||
### [zoomOut](/typedocs/types/ZoomInOut.html/)
|
||||
|
||||
- Details:
|
||||
@@ -125,25 +126,25 @@ vueFlowInstance.setTransform({ x: 100, y: 100, zoom: 1.5 })
|
||||
|
||||
Zooms to specific level.
|
||||
|
||||
### getElements
|
||||
### [getElements](/typedocs/interfaces/Getters.html#getelements/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns currently stored elements (nodes + edges).
|
||||
|
||||
### getNodes
|
||||
### [getNodes](/typedocs/interfaces/Getters.html#getnodes/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns currently stored nodes.
|
||||
|
||||
### getEdges
|
||||
### [getEdges](/typedocs/interfaces/Getters.html#getedges/)
|
||||
|
||||
- Details:
|
||||
|
||||
Returns currently stored edges.
|
||||
|
||||
### toObject
|
||||
### [toObject](/typedocs/interfaces/Actions.html#toobject/)
|
||||
|
||||
- Details:
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
Vue Flow allows you to configure zoom, graph and flow behavior.
|
||||
Configuration can be passed either as props to the `VueFlow` component or
|
||||
as options to the `useVueFlow` composable.
|
||||
as options to the [`useVueFlow`](/guide/composables.html#usevueflow/) composable.
|
||||
|
||||
<CodeGroup>
|
||||
<CodeGroupItem title="Props" active>
|
||||
@@ -36,7 +36,8 @@ useVueFlow({
|
||||
|
||||
## Updating Config
|
||||
|
||||
You can update the configuration at any point, either by having them bound as props or using the state values returned by `useVueFlow`.
|
||||
You can update the configuration at any point, either by having them bound as props or using the state values returned
|
||||
by `useVueFlow`.
|
||||
|
||||
<CodeGroup>
|
||||
<CodeGroupItem title="Props" active>
|
||||
@@ -269,7 +270,8 @@ const edges = ref([
|
||||
|
||||
Enable/disable default state update handlers.
|
||||
|
||||
If you want to have full control of state changes, you can disable the default behavior and apply your own change handlers to the state.
|
||||
If you want to have full control of state changes, you can disable the default behavior and apply your own change
|
||||
handlers to the state.
|
||||
|
||||
- Example:
|
||||
|
||||
@@ -312,7 +314,7 @@ const edges = ref([
|
||||
- Details:
|
||||
|
||||
The path to use when drawing a connection-line (`bezier`, `step`, `smoothstep`).
|
||||
|
||||
|
||||
When using a custom connection line this prop does nothing.
|
||||
|
||||
### connection-line-style <Badge class="text-white" style="line-height: inherit" text="optional" vertical="top" />
|
||||
@@ -343,7 +345,7 @@ const edges = ref([
|
||||
|
||||
- Details:
|
||||
|
||||
Define a key which can be used to activate zoom.
|
||||
Define a key which can be used to activate zoom.
|
||||
|
||||
Overwrites zoom-on-scroll or pan-on-scroll behavior as long as the key is pressed.
|
||||
|
||||
@@ -405,7 +407,7 @@ const edges = ref([
|
||||
|
||||
Specify on which axis panning is allowed (x, y or both).
|
||||
|
||||
### pan-on-drag <Badge class="text-white" style="line-height: inherit" text="optional" vertical="top" />
|
||||
### pan-on-drag <Badge class="text-white" style="line-height: inherit" text="optional" vertical="top" />
|
||||
|
||||
- Old name: `paneMovable`
|
||||
|
||||
@@ -435,7 +437,8 @@ const edges = ref([
|
||||
|
||||
- Details:
|
||||
|
||||
Set a class name which prevents elements from triggering wheel-scroll events (thus disabling zoom/pan-scroll behavior on the element).
|
||||
Set a class name which prevents elements from triggering wheel-scroll events (thus disabling zoom/pan-scroll behavior
|
||||
on the element).
|
||||
|
||||
Useful if you want to allow for scrolling _inside_ a node
|
||||
|
||||
@@ -481,7 +484,7 @@ const edges = ref([
|
||||
|
||||
- Type: [`CoordinateExtent`](/typedocs/types/CoordinateExtent.html/)
|
||||
|
||||
- Default:
|
||||
- Default:
|
||||
|
||||
```ts:no-line-numbers
|
||||
[
|
||||
@@ -528,7 +531,6 @@ const edges = ref([
|
||||
|
||||
Define a key which can be used to activate remove elements from the pane.
|
||||
|
||||
|
||||
## Global Node Options
|
||||
|
||||
### nodes-draggable <Badge class="text-white" style="line-height: inherit" text="optional" vertical="top" />
|
||||
@@ -539,7 +541,7 @@ const edges = ref([
|
||||
|
||||
- Details:
|
||||
|
||||
Globally enable/disable dragging nodes.
|
||||
Globally enable/disable dragging nodes.
|
||||
|
||||
Can be overwritten by setting `draggable` on a specific node element.
|
||||
|
||||
@@ -708,7 +710,7 @@ const elements = ref([
|
||||
|
||||
- Details:
|
||||
|
||||
Allow edges to be created by clicking two handles in a row.
|
||||
Allow edges to be created by clicking two handles in a row.
|
||||
|
||||
Useful if you want to enable creating edges on a touch device.
|
||||
|
||||
@@ -732,7 +734,8 @@ const elements = ref([
|
||||
|
||||
When connection is emitted, automatically create a new edge from params.
|
||||
|
||||
Also accepts a [`Connector`](/typedocs/types/Connector.html/) which returns an edge-like object or false (if creating an edge is not allowed).
|
||||
Also accepts a [`Connector`](/typedocs/types/Connector.html/) which returns an edge-like object or false (if creating
|
||||
an edge is not allowed).
|
||||
|
||||
This option can be used as a shorthand for `onConnect((params) => addEdges([params]))`.
|
||||
|
||||
|
||||
@@ -2,10 +2,11 @@
|
||||
|
||||
Under the hood Vue Flow uses [Provide/Inject](https://v3.vuejs.org/guide/component-provide-inject.html)
|
||||
to pass around it's state between components.
|
||||
You can access the internal state through the `useVueFlow` composable.
|
||||
You can access the internal state through the [`useVueFlow`](/guide/composables.html#usevueflow/) composable.
|
||||
|
||||
`useVueFlow` can be used to either create a new state instance and inject it into the current component tree or inject
|
||||
an already existing store from the current context.
|
||||
[`useVueFlow`](/guide/composables.html#usevueflow/) can be used to either create a new state instance and inject it into
|
||||
the current component tree or inject
|
||||
an already existing store from the current context.
|
||||
Internal state can be manipulated, for example by adding new elements to the state. The
|
||||
state is reactive and changes will be reflected on the graph.
|
||||
|
||||
@@ -27,7 +28,8 @@ watch(getNodes, (nodes) => console.log('nodes changed', nodes))
|
||||
|
||||
## Accessing Internal State
|
||||
|
||||
Using the composition API also allows us to pass the state around outside the current component context, thus we have a lot more flexibility when it comes
|
||||
Using the composition API also allows us to pass the state around outside the current component context, thus we have a
|
||||
lot more flexibility when it comes
|
||||
to reading, writing and updating the state.
|
||||
|
||||
Consider this example, where we want to create a Sidebar that allows us to select all nodes.
|
||||
@@ -44,10 +46,13 @@ Consider this example, where we want to create a Sidebar that allows us to selec
|
||||
</template>
|
||||
```
|
||||
|
||||
We could pass all necessary info as props to the Sidebar, which could become either tedious or result in prop drilling, which we want to avoid.
|
||||
In this example it wouldn't be a big issue but if our destination was 3 components deep, it would become hard to track the flow of information.
|
||||
We could pass all necessary info as props to the Sidebar, which could become either tedious or result in prop drilling,
|
||||
which we want to avoid.
|
||||
In this example it wouldn't be a big issue but if our destination was 3 components deep, it would become hard to track
|
||||
the flow of information.
|
||||
|
||||
Instead, we can initialize a Vue Flow store instance __before__ the Sidebar is initialized, thus the instance becomes available as an injection in the component tree.
|
||||
Instead, we can initialize a Vue Flow store instance __before__ the Sidebar is initialized, thus the instance becomes
|
||||
available as an injection in the component tree.
|
||||
|
||||
```vue:no-line-numbers{5-6}
|
||||
<script>
|
||||
@@ -85,14 +90,17 @@ const selectAll = () => {
|
||||
```
|
||||
|
||||
::: tip
|
||||
If you have multiple store instances in the same context, make sure to give them a unique id in order to guarantee access to the correct instance.
|
||||
Otherwise `useVueFlow` will try to inject the first instance it can find in the current context, which would usually be the last one that has been injected.
|
||||
:::
|
||||
If you have multiple store instances in the same context, make sure to give them a unique id in order to guarantee
|
||||
access to the correct instance.
|
||||
Otherwise `useVueFlow` will try to inject the first instance it can find in the current context, which would usually be
|
||||
the last one that has been injected.
|
||||
:::
|
||||
|
||||
## State Updates
|
||||
|
||||
State updates like removing elements or updating positions are applied by default.
|
||||
If you want to strictly control state changes you can disable this behavior by setting the `applyDefault` option/prop to `false`.
|
||||
If you want to strictly control state changes you can disable this behavior by setting the `applyDefault` option/prop
|
||||
to `false`.
|
||||
|
||||
```vue:no-line-numbers
|
||||
<div style="height: 300px">
|
||||
@@ -100,14 +108,16 @@ If you want to strictly control state changes you can disable this behavior by s
|
||||
</div>
|
||||
```
|
||||
|
||||
State changes are emitted by the `onNodesChange` or `onEdgesChange` events, which will provide an array of changes that have been triggered.
|
||||
State changes are emitted by the `onNodesChange` or `onEdgesChange` events, which will provide an array of changes that
|
||||
have been triggered.
|
||||
To take control of state changes you can implement your own state update handlers or use the state helper functions that
|
||||
come with the library to mix it up.
|
||||
|
||||
## Access State in Options API
|
||||
|
||||
`useVueFlow` was designed to be used in the composition API, __but__ it is still possible to use it in the options API.
|
||||
Though it is necessary to pass a unique id for your Vue Flow state instance, otherwise a look-up will fail and Vue Flow will create a new state instance
|
||||
Though it is necessary to pass a unique id for your Vue Flow state instance, otherwise a look-up will fail and Vue Flow
|
||||
will create a new state instance
|
||||
when mounted.
|
||||
|
||||
```vue:no-line-numbers{4,32}
|
||||
|
||||
Reference in New Issue
Block a user