问题描述
我正在使用 Vue 3 Composition API 和来自 Vuex 4 的 useStore 钩子
这就是我从 setup() 内的 vuex 商店获取数据(id)的方式
setup () {
const store = useStore()
const allIds = computed(() => store.state.ids)
function printIds () {
console.log(allIds.value)
}
//...
}
问题是我无法使用 allIds 数组,因为它包含在 Proxy 中。这就是我在 console.log(allIds.value) 上得到的 -
当我在模板中使用这个数组时,它工作正常,但我想使用这个数据作为有效负载,使用数组中的 1 个 id 在组件内部进行另一个动作分派。我怎样才能做到这一点?我发现的所有示例都是在模板中使用商店数据。
谢谢。
解决方法
代理不会阻止您将数据用作有效负载,您只需要使用 .value
属性并从那里正确访问数据即可。
allIds
变量是一个对象,其 pads
属性中有一个数组。所以要传递数组中的第一项,例如:
const store = useStore()
const allIds = computed(() => store.state.ids)
store.dispatch('actionName',allIds.value.pads[0]);
商店
actions: {
actionName({ commit },payload) {
console.log(payload);
}
}