vuex 没有反应答案

【问题标题】：vuex not reactive whenvuex 没有反应
【发布时间】：2020-10-28 05:47:32
【问题描述】：

我正在使用 vuex，我想在数组中引用一个 getter。

例如

vuex 商店

export default new Vuex.Store({
   state: () => ({
      projectData: {
           projectHours: null,
      },
   }),

   getters: {
        projectHours: state => {
         return state.projectData.projectHours
       },
   },

})

code.vue

data: function() {

    return {

      projectInfoLayout: [{
            "data_1": this.projectHours
      }],
    }
}
computed: {
    ...mapGetters([ 'projectHours' ])
},

...

HTML 代码

     <div v-for="item in projectInfoLayout">

       {{item.data_1}} // NOT REACTIVE

       {{projectHours}} // REACTIVE

     </div>

当我使用 getter（projectHours 和 mapGetters）时，它可以工作

当我使用参考 data_1 时，它不是反应式的。

请问，你有什么想法吗？

提前致谢

韩国

乔瓦尼

【问题讨论】：

标签： vue.js vuejs2 vuex

【解决方案1】：

你应该使用计算属性而不是静态数组——静态数据在组件创建时初始化，以后不会被 Vue 自动修改：

computed: {
    ...mapGetters([ 'projectHours' ]),
    projectInfoLayout()
    {
      return [
        data_1: this.projectHours,
      ];
    }
},

【讨论】：