Question

我正在将对象数组调度到Veux商店，并尝试使用Vuex中的“获取器”获取数据。返回未定义。但是，它适用于同一Vuex中的布尔变量。对于数组，它没有给出正确的结果

我正在使用Vuex更新vue组件中的对象数组。

我正在调度对象数组

通过“操作”提交数组

通过“突变”设置和更新值

通过“状态”声明数组

最后，从Vue组件中，通过“获取器”访问数组

当我使用“ getters”访问时，我希望Vuex返回对象数组。

商店代码如下

export default new Vuex.Store({
  state: {
    
      loading: false,
      compoData: []
  },

  mutations: {
 
    setLoading(state, payload) {
      state.loading = payload
    },

    setCompoData(state, payload) {
       state.compoData = payload.data
     }
  },


actions: {
    
    setLoading({
      commit
    }, payload) {
      commit('setLoading', payload)
    },

    setCompoData({
      commit
    }, payload) {
      commit('setCompoData', payload)
    },

  },
  
  
  getters: {
    
    loading(state) {
      return state.loading
    },
    
    compoaData(state){
      return state.compoData
    }

  }
})

Vue组件代码如下。我正在将组件中的“ compoData”对象数组调度到商店中

  someFunction(){
            
    .....
    some code
    .....
    this.$store.dispatch('setLoading',false)
    this.$store.dispatch('setCompoData',{data:this.compoData})
           
            
        },

从商店获取值

       
       
       gettingCompoData(){
            console.log(this.$store.getters.compoData)
            
        },

尽管它可以很好地与计算变量“ loading”一起使用，但不适用于对象的“ compoData”数组。

我通过以下功能对其进行了测试

test(){
    console.log(this.compoData, this.loading);
    this.$store.dispatch('setCompoData',{data:this.compoData})
    console.log(this.$store.getters.compoData, this.$store.getters.loading)
},

这是我得到这个log result from the "test" function

的结果的屏幕截图

很明显，我没有发送未定义的数组。但是我从商店的吸气剂得到的东西是不确定的。奇怪的是，它适用于布尔变量“ loading”，并且确实返回有效结果。我对为什么它不返回对象数组感到困惑。请帮帮我...

任何帮助将不胜感激。谢谢

Answer 1

您有错字。在商店中，您定义了一个吸气剂compoaData，从商店中获取值时，您正在寻找compoData

无法更新Vuex存储和检索阵列

1 个答案: