Question

这更是一个“我应该使用哪种方法”的问题，而不是一个方法。

我的Vuex.Store()实例中有以下内容：

store.js：

export default new Vuex.Store({
  state: {
    acceptedTermsAndConditions: false
  },
})

我从各个组件发出一个事件，该事件根据不同的用户输入将this.$store.state.acceptedTermsAndConditions设置为true或false。

但是，在我的组件中，我会将“接受T＆C”复选框的选中值设置为该值，如下所示：

components/Component.Vue：

data () {
    return {
        form: {
            checkboxTermsAndConditions: this.$store.state.acceptedTermsAndConditions
        }
    }
}

我只是不确定用什么方法来处理？解决方案是否需要getter？如果不是，那么监视状态变化并相应地设置数据值的最佳方法是什么？

Answer 1

如果要基于存储的值设置复选框状态，则应在组件中使用计算对象和mapGetters辅助函数：

computed: {
...mapGetters(['acceptedTermsAndConditions'])
}

就像这样，您可以在组件中访问该值。如果您想做相反的事情（根据复选框的值刷新商店），则应在商店中创建一个变体，并在组件中使用它：

methods: {
...mapMutations(['setTACcheckbox'])
}

通过这种方法，您可以在组件内部使用this.setTACcheckbox（value）刷新存储值。