vuex中更新对象或数组的值页面不更新的问题
在Vuex中,如果store中数据是数组或者是对象,操作之后,vuex 数值已经改变了,但页面展示的对应数值却没有改变。
类似的情况,大部分出现在这几个场景
导致原因
Vue2 Object.defineProperty的本身的机制问题,拓展https://cn.vuejs.org/v2/guide/reactivity.html#%E5%A6%82%E4%BD%95%E8%BF%BD%E8%B8%AA%E5%8F%98%E5%8C%96
Vue.js是基于Object.defineProperty对对象实现“响应式化”,而对于数组,Vue.js提供的方法是重写push、pop、shift、unshift、splice、sort、reverse这七个数组方法。修改数组原型方法的代码可以参考observer/array.js以及observer/index.js。
参考Vue官网。
解决方案