访问Vuex突变中的getter

问题描述

在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属性，但我希望您能看到我想要做的事情。即有条件地操作状态。

在突变中，this为undefined，state参数提供对state对象的访问，而不是对存储的睡觉的访问。

The documentation on mutations未提及有关执行此操作的任何内容。

我猜这是不可能的，除非我错过了什么？我猜另一种选择是要么在存储外执行此逻辑(导致代码重复)，要么实现一个执行此操作的操作，因为操作可以访问整个存储上下文。我非常肯定这是一种更好的方法，那就是让突变集中在它实际应该做的事情上；突变状态。这可能就是我最终要做的事情，但我只是好奇是否可以访问突变中的getter？

推荐答案

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和state的读取访问权限。然后，该逻辑的输出可以传递给变异。因此，您可以将对getters对象的引用传递给突变，但没有必要这样做，这会搅乱局面。

这篇关于访问Vuex突变中的getter的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！