Vue.js[vuex] how to dispatch from a mutation?

Viewed 38220

I have a list of filters I want to apply to a json object.

My mutations look like this:

const mutations = {
    setStars(state, payload) {
        state.stars = payload;
        this.dispatch('filter');
    },

    setReviews(state, payload) {
        state.reviews = payload;
        this.dispatch('filter');
    }
};

Because of how filters work I need to re-apply them all again since I can't simply keep downfiltering a list because this gets me into trouble when a user de-selects a filter option.

So when a mutation is being made to a stars filter or reviews filter(user is filtering) I need to call a function that runs all my filters.

What is my easiest option here? Can I add some kind of helper function or possible set up an action which calls mutations that actually filter my results?

2 Answers

You can actually dispatch actions from a mutation by using this. For example:

const actions = {
  myAction({ dispatch, commit }, { param }) {
  // Do stuff in my action
  }
}

const mutations = {
  myMutation(state, value) {

    state.myvalue = value;
    this.dispatch('myModule/myAction', { param: 'doSomething' });
  },
}
Related