docs: update node guide
This commit is contained in:
@@ -383,6 +383,8 @@ interface CustomNodeProps extends NodeProps<any, CustomNodeEvents> {
|
|||||||
events: CustomNodeEvents
|
events: CustomNodeEvents
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const props = defineProps<CustomNodeProps>()
|
||||||
|
|
||||||
props.events.click(() => {
|
props.events.click(() => {
|
||||||
console.log(`Node ${props.id} clicked`)
|
console.log(`Node ${props.id} clicked`)
|
||||||
})
|
})
|
||||||
@@ -390,6 +392,7 @@ props.events.click(() => {
|
|||||||
// custom events are just functions, they are not hooks which you can listen to like `click`
|
// custom events are just functions, they are not hooks which you can listen to like `click`
|
||||||
props.events.customEvent('custom event triggered')
|
props.events.customEvent('custom event triggered')
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<!-- Omitted for simplicty -->
|
<!-- Omitted for simplicty -->
|
||||||
</template>
|
</template>
|
||||||
@@ -413,14 +416,14 @@ When you create a new node type you also need to implement some styling. Your cu
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
### Allow scrolling inside a node
|
## 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
|
You can use the `noWheelClassName` prop to define a class which will prevent zoom-on-scroll or pan-on-scroll behavior on
|
||||||
that element.
|
that element.
|
||||||
By default, the `noWheelClassName` is `.nowheel`.
|
By default, the `noWheelClassName` is `.nowheel`.
|
||||||
By adding this class you can also enable scrolling inside a node.
|
By adding this class you can also enable scrolling inside a node.
|
||||||
|
|
||||||
### Dynamic handle positions / Adding handles dynamically
|
## Dynamic handle positions / Adding handles dynamically
|
||||||
|
|
||||||
When working with dynamic handle positions or adding handles dynamically, you need to use
|
When working with dynamic handle positions or adding handles dynamically, you need to use
|
||||||
the [`updateNodeInternals`](/typedocs/types/UpdateNodeInternals) method.
|
the [`updateNodeInternals`](/typedocs/types/UpdateNodeInternals) method.
|
||||||
@@ -431,7 +434,7 @@ misaligned.
|
|||||||
You can either use the store action to update multiple nodes at once by passing their ids into the method,
|
You can either use the store action to update multiple nodes at once by passing their ids into the method,
|
||||||
or you can emit the `updateNodeInternals` event from your custom node component without passing any parameters.
|
or you can emit the `updateNodeInternals` event from your custom node component without passing any parameters.
|
||||||
|
|
||||||
#### Examples
|
### Examples
|
||||||
|
|
||||||
- Using store action
|
- Using store action
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user