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变更不是通过gette.
·
我一开始这么写的:
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更多推荐
已为社区贡献1条内容
所有评论(0)