我正在将一个对象数组分派(dispatch)到 Veux 存储,并尝试使用 Vuex 中的“getters”获取数据。它返回未定义。然而,它适用于同一个 Vuex 中的 bool 变量。对于数组,它没有给出正确的结果
我正在使用 Vuex 跨 vue 组件更新对象数组。
我正在调度对象数组
通过“actions”提交数组
通过“突变”设置和更新值
通过“state”声明数组
最后,从Vue组件中,通过“getters”访问数组
当我使用“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”从组件分派(dispatch)到存储
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
很明显,我没有发送未定义的数组。但我从商店获取者那里得到的信息是未定义的。奇怪的是,它适用于 bool 变量“loading”,并且确实返回有效结果。我很困惑为什么它不返回对象数组。请帮帮我...
如有任何帮助,我们将不胜感激。谢谢
最佳答案
你有一个错字。
在 store 中,您定义了一个 getter compoaData
,当从 store 获取值时,您正在寻找 compoData
关于javascript - 无法更新 Vuex 存储和检索数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57762775/