How to access getters within Vuex mutations with Vue.js?

Sometimes, we want to access getters within Vuex mutations with Vue.js.

In this article, we’ll look at how to access getters within Vuex mutations with Vue.js.

How to access getters within Vuex mutations with Vue.js?

To access getters within Vuex mutations with Vue.js, we just use the state in the getter and call the getter with the state.

For instance, we write

//...
const store = new Vuex.Store({
  //...
  getters: {
    foo: (state) => {
      return getterFunc(state);
    },
  },
  mutations: {
    fooMutation: (state, data) => {
      getterFunc(state);
    },
  },
  //...
});

to call getterFunc in both the foo getter and the fooMutation mutation.

getterFunc is used to return the same data from the state in both methods.

Conclusion

To access getters within Vuex mutations with Vue.js, we just use the state in the getter and call the getter with the state.