在 Vuex 突变中访问 getter

Question

在 Vuex 存储突变中，是否可以访问 getter？考虑下面的例子。

 new Vuex.Store({
    state: {
        question: 'Is it possible to access getters within a Vuex mutation?'
    },
    mutations: {
        askQuestion(state) {
            // TODO: Get question from getter here
            let question = '';

            if (question) {
                // ...
            }
        }
    },
    getters: {
        getQuestion: (state) => {
            return state.question;
        }
    }
});

当然这个例子没有多大意义，因为我可以直接在 state 对象上访问 question 属性，但我希望你看到我想要的做。也就是说，有条件地操纵状态。

Within the mutation, this is undefined and the state parameter gives access to the state object, and not the rest of the store.

关于突变的文档 没有提到任何关于这样做的内容。

我的猜测是这是不可能的，除非我错过了什么？我想另一种选择是在商店之外执行此逻辑（导致代码重复）或实施执行此操作的操作，因为操作可以访问整个商店上下文。我很确定这是一种更好的方法，那就是让突变专注于它实际应该做的事情；改变状态。这可能是我最终会做的事情，但我只是好奇是否可以访问突变中的吸气剂？

原文由 ba0708 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

Vuex 存储变异方法不提供对 getter 的直接访问。

这可能是不好的做法*，但您可以在提交这样的突变时传递对 getters 的引用：

 actions: {
  fooAction({commit, getters}, data) {
    commit('FOO_MUTATION', {data, getters})
  }
},
mutations: {
  FOO_MUTATION(state, {data, getters}) {
    console.log(getters);
  }
}

---

\* 最好的做法是让突变尽可能简单，只直接影响 Vuex 状态。这使得推理状态变化变得更容易，而无需考虑任何副作用。现在，如果您遵循 vuex getter 的最佳实践，它们首先不应该有任何副作用。但是，任何需要引用 getter 的逻辑都可以在操作中运行，该操作具有对 getter 和状态的读取访问权限。然后该逻辑的输出可以传递给突变。因此，您 可以 将 getters 对象的引用传递给突变，但没有必要，它会使水变得混乱。

原文由 thanksd 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

如果您将 getter 和 mutation 放在单独的模块中，则可以在 mutation 中导入 getter，然后执行以下操作：

 import getters from './getters'

askQuestion(state) {
  const question = getters.getQuestion(state)
  // etc
}

原文由 Kees de Kooter 发布，翻译遵循 CC BY-SA 4.0 许可协议