davestewart / vuex-pathify

Vue / Vuex plugin providing a unified path syntax to Vuex stores
https://davestewart.github.io/vuex-pathify
MIT License
1.37k stars 57 forks source link

How set a sub-property using call() ? #112

Closed Peppe87 closed 3 years ago

Peppe87 commented 3 years ago

Hi,

I've a simple a store with some nested properties, such as

const state = {
  prop1: true,
  ...
  nestedProperties: { subproperty1: true }
};

const mutations = make.mutations(state);
const actions = make.actions(state);
const getters = make.getters(state);

export default {
  namespaced: true,
  state,
  mutations,
  actions,
  getters
};

How can I use call() helper in a component to set "subproperty1" value? I've unsuccessfully tried various combination to define it, such as:

  methods: {
    setSubProp: call("myModule/setNestedProperties@subproperty1")
  }

or

  methods: {
    setSubProp: call("myModule/nestedProperties@setSubproperty1")
  }

Actually I didn't found any example, is that possible?

davestewart commented 3 years ago

Hi there,

And thanks for the examples.

The call() helper is actually to call store actions.

What you want (I presume) is either the sync helper:

export default {
  computed: {
    value: sync('myModule/nestedProperties@subproperty1') // using sync, even though we won't get
  },
  methods: {
    setValue (value) {
      this.value = value
    }
  }
}

Or the global set method:

export default {
  methods: {
    setValue (value) {
      this.$store.set('myModule/nestedProperties@subproperty1', value)
    }
  }
}

Does that help?

Peppe87 commented 3 years ago

Whups, I forgot to reply 🤦

Yes, thank you, your answer solved my problem!