mpvue vant-weapp踩坑记录之数组或对象中的数据发生改变后视图层没刷新的问题

mpvue中数组或对象中的数据发生改变后视图层没刷新的问题

使用mpvue动态修改对象中数组的数据,页面不进行渲染

deleteImg(event) {
   const { index, name } = event.mp.detail;
   const fileList = this.policyItem[event.mp.currentTarget.dataset.key]
   fileList.splice(index, 1)
   this.policyItem[event.mp.currentTarget.dataset.key] = fileLis
 }

这样写了之后，发现点击删除按钮，删除图片，数据是发生了改变，但是视图并未刷新。
再更改方法（使用this.$set）：

this.$set(this.policyItem,event.mp.currentTarget.dataset.key,fileList)

依旧没有效果，查看了别人的博客有解释：

在mpvue中并不会触发setter从而使视图层同步刷新，但是在vue中却是没问题，这估计是mpvue本身的坑，开发过程中有时候也会发现$set好像也不是挺管用。。。

修改后的写法（通过concat()拼接，从而直接触发setter来使dom视图层能同步刷新）：

deleteImg(event) {
   const { index, name } = event.mp.detail;
   const fileList = this.policyItem[event.mp.currentTarget.dataset.key].concat()
   fileList.splice(index, 1)
   this.policyItem[event.mp.currentTarget.dataset.key] = fileList
}

参考资料

vue官方文档-数组更新检测
解析Vue数据/数组对象改变视图不更新
Vue中数组和对象更改后视图不刷新的问题
mpvue踩坑之setter触发相关&Vue中数组和对象更改后视图不刷新的问题