Question

让我们说我们有这样的事情：

const moduleA = {
  state: { name: 'Cristian' },
  namespaced: true,
}

const moduleB = {
  state: { color: 'red' },
  namespaced: true,
}

const store = new Vuex.Store({
  state: { user: null, },
  modules: {
    a: moduleA,
    b: moduleB
  },
  mutations: {
    setPropValue(state, payload) {
      for (let [key, value] of Object.entries(payload)) {
        state[key] = value;
      }
    },
  },
})

在我的vue实例上，当用户登录/注销并相应地更改状态时，我有一个firebase观察者。所以我想要实现的是这样的：

const payload = {
  module: 'root',
  payload: { user, },
}

this.$store.commit('setPropValue', {payload});

然后是另一个模块：

const payload = {
  module: 'a',
  payload: { name: 'Alexander', },
}

并运行相同的逻辑，但使用不同的负载并更改模块a：

中的道具

this.$store.commit('setPropValue', {payload});

Answer 1

不要直接承诺突变，而是考虑使用动作

this.$store.dispatch('setPropValue', { user });

然后在vuex中，你的行动

actions: {
  setPropValue({ commit }, { user }) {
    commit("a/setName", user.name);
    commit("b/setColor", user.favoriteColor);
  }
}

每个模块都需要自己的“本地”变异才能修改模块状态。

有关详细信息，请参阅https://vuex.vuejs.org/en/modules.html

是否有可能使用vuejs2中的另一个模块mutator来改变模块中的状态prop？

1 个答案: