Vue Array、Object修改不刷新渲染dom问题解决

我一开始这么写的:

let obj = {k:'v'};
delete obj['k']

发现dom没有更新，想来是Vue没有检测到改对象的变动，于是查了下资料：

https://blog.csdn.net/zifeiyu130/article/details/78950244

这篇文章讲的还算详细

大意就是说Vue重写了对象的getter\setter来触发dom重新渲染

如果一些js变更不是通过getter\setter来修改的话，Vue是检测不到变量变更的

Vue对于Array有重写其push、splice等方法，所以我们直接用这些重写的方法也可以触发dom刷新

对于Object，Vue提供了一些方法直接操作Object，并且决定是否渲染视图：

this.$set(target, key, val);
this.$delete(target, key);

其中this指代Vue对象

Vue中遍历Object也很简单：

<div v-for="(value,key) in obj"></div>

与遍历数组一样，是value在前，key在后，只不过数组中的key是index