how can you commit a vuex store mutation from within a vue-router that imports a store?

I’ve been googling for a very long time, and didn’t find a stackoverflow answer or a vue forums answer for this specific case or issue, so below is the solution that I tested and works in my case.

For whatever reason, I can’t trigger commit. However, I can simply invoke the mutation directly, and this change is then reflected throughout other components (as in, a “different” store wasn’t imported).

someRoute.js

import Store from 'store/store.js'

const someRoute = {
  path: '/blah',
  beforeEnter(to, from, next) {
    Store.modules.app.mutations.setShouldDoThing(Store.modules.app.state, true);
    next();
  }
}

And later, in some component:

someComponent.vue

export default {
    beforeMount() {
      console.log(this.$store.state.app.shouldDoThing);
      // true
    }
}

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top