Vue.set 方法是如何实现的

为什么$set可以触发更新,我们给对象和数组本身都增加了dep属性,当给对象新增不存在的属性则触发对象依赖的watcher去更新,当修改数组索引时我们调用数组本身的splice方法去更新数组。

补充回答:

官方定义Vue.set(object, key, value)

1.判断目标值是否为有效值,不是有效值直接停止

2.判断是否为数组,并且key值是否为有效的key值

如果是数组,就选择数组的长度和key值取较大值作为数组的新的length值,并且替换目标值

splice方法,重写了,所以执行splice,会双向数据绑定

3.判断目标值是否为响应式的__ob__

如果是vue实例,直接不行

如果不是响应式的数据,就是普通的修改对象操作
如果是响应式数据,那就通过Object.defineProperty进行数据劫持

4.通知dom更新

了解更多前端面试问题欢迎关注小编前端培训专栏!

上一篇:VUE-ZGH


下一篇:JS 清空数组的方式