vue双向绑定原理1

数据劫持(数据代理)

定义:数据劫持,指的是在访问或者修改对象的某个属性时,通过一段代码拦截这个行为,进行额外的操作或者修改返回结果
Vue是通过Object.defineProperty()来劫持数据的get/set.

vm.$set()原理

vm.$set()在new Vue()时候就被注入到Vue的原型上。
vm.$set()解决了什么问题? 避免滥用
在Vue.js里面只有data中已经存在的属性才会被Observe为响应式数据, 如果你是新增的属性是不会成为响应式数据, 因此Vue提供了一个api(vm.$set)来解决这个问题。

Vue不能监听到数组变化

由于 JavaScript 的限制,Vue 不能检测以下变动的数组:
当你直接设置一个项的索引时, 例如: vm.items[indexOfItem] = newValue
当你修改数组的长度时, 例如: vm.items.length = newLength

参考资料:
数据劫持(数据代理)
为什么直接修改数组长度或设置数组项的索引时,Vue不能检测到数组的变动?
Vue源码: vm.$set原理分析

猜你喜欢

转载自www.cnblogs.com/songsongblue/p/12650094.html
今日推荐