别想她╰ 2022-05-04 13:52:37
我之前没想通为什么vue会数组方法进行变异,能变异到哪里去,pop()还是pop()呀,看了诸位的回答明白了。vue是通过Object.defineProperty
来监听数据的变化,但是这个方法并不能监听数组长度的变化等,所以要对数组进行hack,让vue检测到内部的变化
动态检测数组原型
/* * not type checking this file because flow doesn't play well with * dynamically accessing methods on Array prototype */ var arrayProto = Array.prototype; var arrayMethods = Object.create(arrayProto); var methodsToPatch = [ 'push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse' ]; /** * Intercept mutating methods and emit events */ methodsToPatch.forEach(function(method) { // cache original method var original = arrayProto[method]; def(arrayMethods, method, function mutator() { var args = [],len = arguments.length; while (len--) args[len] = arguments[len]; var result = original.apply(this, args); var ob = this.__ob__; var inserted; switch (method) { case 'push': case 'unshift': inserted = args; break case 'splice': inserted = args.slice(2); break } if (inserted) { ob.observeArray(inserted); } // notify change ob.dep.notify(); return result }); }); /** * Observe a list of Array items. */ Observer.prototype.observeArray = function observeArray(items) { for (var i = 0, l = items.length; i < l; i++) { observe(items[i]); } };
这是源码,还不是很理解。
大概意思就是调用数组的原型方法,如果推入了一个对象, 那么会调动observe的方法将对象改成响应式对象,然后再通知观察者进行更新
- 共 1 页
- 1
第 92 题:已知数据格式,实现一个函数 fn 找出链条中所有的父级 id