Vue.js 已分配计算(computed)属性，但它没有设置器

发布于12月21日

什么是正确的语法/钩子使myVal工作？

我的代码如下所示:

<v-item-group v-model="myVal" ...

import { mapActions, mapGetters } from 'vuex'; 
export default {
  computed : {
     ...mapActions({
       myVal: 'myModulePath/setMyVal'
     }),
     ...mapGetters({
       myVal: 'myModulePath/getMyVal'
     }),
  },
}

这家store 看起来像:

actions: {
  setMyVal({commit}, value){commit('someMutation',value);}
getters: {
  getMyVal: state => { return state.myVal;}

我不知道如何连接它，使"setter"工作，错误信息消失.

我也试过了，但没用:

...mapState('myModulePath', ['myVal'])

推荐答案

您需要告诉vue组件，当计算(computed)属性被指定一个新值时，该怎么做

computed: {
     myVal: {
        get: () => this.$state.store.getters.myModulePath.getMyVal,
        set: (value) => this.$state.commit('someMutation', value )
    }
  }

请注意，我使用setter而不是action.在computed property setter中使用操作是个坏主意，因为操作通常是异步的，并且在以后调试computed property时可能会导致麻烦.