Change another module state from one module in Vuex

Try it with following parameters as suggested here;

commit('TOGGLE_LOADING', null, { root: true })

If you have namespaced set to true (in Nuxt that's the default when in modules mode), this becomes:

commit('loading/TOGGLE_LOADING', null, { root: true })

You can also import the store, as you normally do in any js file and use it. For example:

// src/state/modules/posts.jsimport store from '@/state/store'...store.commit('posts/TOGGLE_LOADING')...

This works pretty well, the only donwside is that can difficult isolate tests or mock-up.

Edition: Recently I have eliminated all code using the technique I mention due the testing problems. Indeed you can always change the state of other modules following the recommended way, as in this example. Very useful if you manage auth and profile in distincts modules.

logout: context => {  return new Promise((resolve) => {    // Clear token in all axios requests    axios.defaults.headers.common['Authorization'] = ''    // Logout from firebase    firebase      .auth()      .signOut()      .then(() => {        // Update state in profile module        context.commit('profile/SET_USER', null, {          root: true        })        resolve()      })      .catch(error => reject(error))  })}

you can use action to commit mutation which defined in another module,then you will modify state in another module.

like this:

posts: {  actions: {    toggleSavingActions(context) {      // some actions       context.commit("TOGGLE_SAVING"); // defined in loading module    }  }}