Closed Coeurdecedre closed 2 years ago
Hi @Coeurdecedre,
Unfortunately, specifying a function to panEnabled
is not supported at this time.
I guess the following steps can be used as an alternative, so please try them out.
(The following explanation assumes the Composition API, but if a different syntax is used, please read it accordingly.)
reactive()
and then pass it to v-network-graph
.
const configs = reactive(
defineConfigs({
view: {
panEnabled: false,
// ...
},
// ...
})
)
<v-network-graph ... :configs="configs" />
$store.state.keyboard.holdingShift
changes by watch
and assign to configs.view.panEnabled
when the value is changed
watch(() => /* store value */, value => {
configs.view.panEnabled = value
})
I hope this helps you.
Thanks @dash14 , I'll use watchers then ! However, would it be possible for you to add the possibility of adding a function this this property in the near future ? Thanks again ^^
Hi @Coeurdecedre, Thank you for your reply. I realized that by using JavaScript's getter functionality, it seems to be possible to achieve your requirement. Please check the below example:
Node and edge configs require a function to be specified as a config in order to retrieve values from each object in some cases. However, since configs.view.* has a single value and the alternatives are available such as using getter/watch, it's not currently considering extending the view configs.
Best Regards,
Hi @dash14 ! Thank you very much for your help ! However, it doesn't work for me :(
This is my code :
I'm using Options API and not Composition API. holdingShift is a computed that return a boolean to each change of shift key status. Do you have an idea to solve my problem ?
Best Regards.
Hi @Coeurdecedre,
Thanks for trying it out!
I think this
in the getter does not point to a component and this.holdingShift
is undefined
.
It may work to create a function that binds this
outside of the getter and call it inside the getter, as shown below.
data() {
const panEnabled = () => !this.holdingShift;
return {
vNGConfigs: {
view: {
get panEnabled() {
return panEnabled();
},
Best Regards,
Hi @dash14 ! Thank you very much for your help !
I put the configs as a computed and it's working ! :)
Best Regards !
Hi @Coeurdecedre, Thank you for your reply. I'm glad you got it resolved! 👍 Best Regards!
Hi ! I would like to know if there was a way to use a function on the panEnabled property that return a boolean ? I tried but it doesn't work.
Thanks for your reply ! :)