当数组的元素发生位置的变化的时候Vue 是如监听听到数组的变化的
时间: 2024-05-18 13:14:40 浏览: 51
vue中是怎样监听数组变化的
Vue可以通过`Object.defineProperty()`方法对数组进行拦截,从而实现监听数组变化。Vue使用了一个包装类`Observer`来包装原始数据,当数组发生变化时,会触发`Observer`的`notify`方法,然后`Observer`会通知依赖于这个数组的所有`Watcher`对象进行更新。
具体来说,Vue对数组的变化进行了以下拦截:
1. 重写数组的7个变异方法:`push`、`pop`、`shift`、`unshift`、`splice`、`sort`、`reverse`,在这些方法中添加通知更新的逻辑。
2. 监听数组的原型方法:`__proto__`、`prototype`、`constructor`,防止这些方法被覆盖。
3. 使用`Object.defineProperty()`方法对数组的每个元素进行拦截,当元素发生变化时,通知更新。
通过以上拦截,Vue可以监听到数组的所有变化,从而实现响应式更新。
阅读全文