使用字典作为状态对象时,Vuex + vue 不响应

kar*_*baq 2 javascript vue.js vuex vue-reactivity

我需要使用字典作为我的存储变量之一,但它不像数组那样反应,解决这个问题的最佳实践是什么?我创建了最小的例子:

https://codesandbox.io/s/vuex-store-forked-ko3md?file=/src/App.vue

Igo*_*aru 6

为了添加新的响应式 props,您应该使用以下Vue.set()方法,而不是使用直接赋值:

  ADD_ITEM(state, { key, value }) {
    Vue.set(state.dict, key, value)
  }
Run Code Online (Sandbox Code Playgroud)

要更深入地了解 Vue 反应性,您应该阅读官方文档:https://v2.vuejs.org/v2/guide/reactivity.html

  • 当然,你可以使用`Vue.delete(object, key)` (2认同)