From 6f9ed9a664ab0009f781c51e7902a67bf9d35f3b Mon Sep 17 00:00:00 2001 From: guy Date: Sat, 12 Dec 2020 23:17:18 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=B8=80=E4=B8=8Bfix?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dist/fix/fix.js | 781 ++++++++++++++++++++++++------------------------ 1 file changed, 389 insertions(+), 392 deletions(-) diff --git a/dist/fix/fix.js b/dist/fix/fix.js index 19c076e5b..509acac76 100644 --- a/dist/fix/fix.js +++ b/dist/fix/fix.js @@ -248,42 +248,6 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons Dep.target = targetStack.pop(); } - var arrayProto = Array.prototype; - var arrayMethods = []; - _.each(['push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse'], function (method) { - var original = arrayProto[method]; - arrayMethods[method] = function mutator() { - for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } - - var ob = this.__ob__; - var inserted = void 0; - switch (method) { - case 'push': - case 'unshift': - inserted = args; - break; - case 'splice': - inserted = args.slice(2); - break; - } - if (inserted) inserted = ob.observeArray(inserted); - switch (method) { - case 'push': - case 'unshift': - args = inserted; - break; - case 'splice': - args = [args[0], args[1]].concat(inserted ? inserted : []); - break; - } - var result = original.apply(this, args); - notify(ob.parent, ob.parentKey, ob.dep, true); - return result; - }; - }); - //如果浏览器不支持ecma262v5的Object.defineProperties或者存在BUG，比如IE8 //标准浏览器使用__defineGetter__, __defineSetter__实现 var canHideProperty = true; @@ -400,280 +364,6 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons var createViewModel$1 = createViewModel; - var arrayKeys = _.keys(arrayMethods); - - var observerState = { - shouldConvert: true - }; - - function def(obj, key, val, enumerable) { - Object.defineProperty(obj, key, { - value: val, - enumerable: !!enumerable, - writable: true, - configurable: true - }); - } - - /** - * Observer class that are attached to each observed - * object. Once attached, the observer converts target - * object's property keys into getter/setters that - * collect dependencies and dispatches updates. - */ - - var Observer = function () { - function Observer(value) { - _classCallCheck(this, Observer); - - this.value = value; - this.dep = new Dep(); - this.vmCount = 0; - if (_.isArray(value)) { - var augment = hasProto ? protoAugment : copyAugment; - augment(value, arrayMethods, arrayKeys); - this.model = this.observeArray(value); - } else { - this.model = this.walk(value); - } - if (isIE9Below) { - this.model['__ob__'] = this; - } else { - def(this.model, "__ob__", this); - } - } - - Observer.prototype.walk = function walk(obj) { - return defineReactive(obj, this); - }; - - Observer.prototype.observeArray = function observeArray(items) { - for (var i = 0, l = items.length; i < l; i++) { - var ob = observe(items[i], this, i); - items[i] = ob ? ob.model : items[i]; - } - return items; - }; - - return Observer; - }(); - - function protoAugment(target, src, keys) { - /* eslint-disable no-proto */ - target.__proto__ = src; - /* eslint-enable no-proto */ - } - - /* istanbul ignore next */ - function copyAugment(target, src, keys) { - for (var i = 0, l = keys.length; i < l; i++) { - var key = keys[i]; - target[key] = src[key]; - } - } - - function observe(value, parentObserver, parentKey) { - if (!_.isObject(value)) { - return; - } - var ob = void 0; - if (value.__ob__ instanceof Observer) { - ob = value.__ob__; - } else if (observerState.shouldConvert && isExtensible(value) && (_.isArray(value) || isPlainObject(value))) { - ob = new Observer(value); - } - if (ob) { - ob.parent = parentObserver || ob.parent; - ob.parentKey = parentKey; - } - return ob; - } - - function notify(observer, key, dep, refresh) { - dep.notify({ observer: observer, key: key, refresh: refresh }); - if (observer) { - //触发a.*绑定的依赖 - _.each(observer._deps, function (dep) { - dep.notify({ observer: observer, key: key }); - }); - //触发a.**绑定的依赖 - var parent = observer, - root = observer, - route = key || ""; - while (parent) { - _.each(parent._scopeDeps, function (dep) { - dep.notify({ observer: observer, key: key }); - }); - if (parent.parentKey != null) { - route = parent.parentKey + '.' + route; - } - root = parent; - parent = parent.parent; - } - for (var _key2 in root._globalDeps) { - var reg = new RegExp(_key2); - if (reg.test(route)) { - root._globalDeps[_key2].notify({ observer: observer, key: _key2 }); - } - } - } - } - - function defineReactive(obj, observer, shallow) { - var props = {}; - var model = void 0; - // if (typeof Proxy === 'function') { - // const deps = {}, childObs = {}, cache = {} - // _.each(obj, function (val, key) { - // if (key in $$skipArray) { - // return - // } - // cache[key] = val - // const dep = deps[key] = (observer && observer['__dep' + key]) || new Dep() - // observer && (observer['__dep' + key] = dep) - // childObs[key] = !shallow && observe(val, observer, key) - // }) - // return model = new Proxy(props, { - // has: function (target, key) { - // return key in obj; - // }, - // get: function (target, key) { - // if (key in $$skipArray) { - // return target[key] - // } - // const value = cache[key] - // if (Dep.target) { - // deps[key].depend() - // if (childObs[key]) { - // childObs[key].dep.depend() - // if (_.isArray(value)) { - // dependArray(value) - // } - // } - // } - // return value - // }, - // set: function (target, key, newVal) { - // if (key in $$skipArray) { - // return target[key] = newVal - // } - // const value = cache[key], dep = deps[key] - // if (newVal === value || (newVal !== newVal && value !== value)) { - // return newVal - // } - // cache[key] = newVal - // childObs[key] = !shallow && observe(newVal, observer, key) - // obj[key] = childObs[key] ? childObs[key].model : newVal - // notify(model, key, dep) - // return obj[key] - // } - // }) - // } - _.each(obj, function (val, key) { - if (key in $$skipArray) { - return; - } - var configurable = isConfigurable(obj, key); - var dep = observer && observer['__dep' + key] || new Dep(); - observer && (observer['__dep' + key] = dep); - var childOb = configurable && !shallow && observe(val, observer, key); - props[key] = { - enumerable: true, - configurable: true, - get: function reactiveGetter() { - var value = childOb ? childOb.model : val; - if (Dep.target) { - dep.depend(); - if (childOb) { - childOb.dep.depend(); - if (_.isArray(value)) { - dependArray(value); - } - } - } - return value; - }, - set: function reactiveSetter(newVal) { - var value = childOb ? childOb.model : val; - if (newVal === value || newVal !== newVal && value !== value) { - return; - } - val = newVal; - childOb = configurable && !shallow && observe(newVal, observer, key); - if (childOb && value && value.__ob__) { - childOb._scopeDeps = value.__ob__._scopeDeps; - childOb._deps = value.__ob__._deps; - } - obj[key] = childOb ? childOb.model : newVal; - notify(model.__ob__, key, dep); - } - }; - }); - return model = createViewModel$1(obj, props); - } - - /** - * Set a property on an object. Adds the new property and - * triggers change notification if the property doesn't - * already exist. - */ - function set(target, key, val) { - if (_.isArray(target)) { - target.length = Math.max(target.length, key); - target.splice(key, 1, val); - return val; - } - if (_.has(target, key)) { - target[key] = val; - return val; - } - var ob = target.__ob__; - if (!ob) { - target[key] = val; - return val; - } - ob.value[key] = val; - target = defineReactive(ob.value, ob); - notify(ob, key, ob.dep); - return target; - } - - /** - * Delete a property and trigger change if necessary. - */ - function del(target, key) { - if (_.isArray(target)) { - target.splice(key, 1); - return; - } - var ob = target.__ob__; - if (!_.has(target, key)) { - return; - } - if (!ob) { - delete target[key]; - return target; - } - delete ob.value[key]; - target = defineReactive(ob.value, ob); - notify(ob, key, ob.dep); - return target; - } - - /** - * Collect dependencies on array elements when the array is touched, since - * we cannot intercept array element access like property getters. - */ - function dependArray(value) { - for (var e, i = 0, l = value.length; i < l; i++) { - e = value[i]; - e && e.__ob__ && e.__ob__.dep.depend(); - if (_.isArray(e)) { - dependArray(e); - } - } - } - var queue = []; var activatedChildren = []; var has = {}; @@ -876,61 +566,371 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons this.dirty = false; }; - Watcher.prototype.depend = function depend() { - var i = this.deps.length; - while (i--) { - this.deps[i].depend(); + Watcher.prototype.depend = function depend() { + var i = this.deps.length; + while (i--) { + this.deps[i].depend(); + } + }; + + Watcher.prototype.teardown = function teardown() { + if (this.active) { + // remove self from vm's watcher list + // this is a somewhat expensive operation so we skip it + // if the vm is being destroyed. + remove(this.vm._watchers, this); + var i = this.deps.length; + while (i--) { + this.deps[i].removeSub(this); + } + this.active = false; + } + }; + + return Watcher; + }(); + + var seenObjects = new Set(); + + function traverse(val) { + seenObjects.clear(); + _traverse(val, seenObjects); + } + + function _traverse(val, seen) { + var i = void 0, + keys = void 0; + var isA = _.isArray(val); + if (!isA && !_.isObject(val)) { + return; + } + if (val.__ob__) { + var depId = val.__ob__.dep.id; + if (seen.has(depId)) { + return; + } + seen.add(depId); + } + if (isA) { + i = val.length; + while (i--) { + _traverse(val[i], seen); + } + } else { + keys = _.keys(val); + i = keys.length; + while (i--) { + _traverse(val[keys[i]], seen); + } + } + } + + var arrayProto = Array.prototype; + var arrayMethods = []; + _.each(['push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse'], function (method) { + var original = arrayProto[method]; + arrayMethods[method] = function mutator() { + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var ob = this.__ob__; + var inserted = void 0; + switch (method) { + case 'push': + case 'unshift': + inserted = args; + break; + case 'splice': + inserted = args.slice(2); + break; + } + if (inserted) inserted = ob.observeArray(inserted); + switch (method) { + case 'push': + case 'unshift': + args = inserted; + break; + case 'splice': + args = [args[0], args[1]].concat(inserted ? inserted : []); + break; + } + var result = original.apply(this, args); + notify(ob.parent, ob.parentKey, ob.dep, true); + return result; + }; + }); + + var arrayKeys = _.keys(arrayMethods); + + var observerState = { + shouldConvert: true + }; + + function def(obj, key, val, enumerable) { + Object.defineProperty(obj, key, { + value: val, + enumerable: !!enumerable, + writable: true, + configurable: true + }); + } + + /** + * Observer class that are attached to each observed + * object. Once attached, the observer converts target + * object's property keys into getter/setters that + * collect dependencies and dispatches updates. + */ + + var Observer = function () { + function Observer(value) { + _classCallCheck(this, Observer); + + this.value = value; + this.dep = new Dep(); + this.vmCount = 0; + if (_.isArray(value)) { + var augment = hasProto ? protoAugment : copyAugment; + augment(value, arrayMethods, arrayKeys); + this.model = this.observeArray(value); + } else { + this.model = this.walk(value); + } + if (isIE9Below) { + this.model['__ob__'] = this; + } else { + def(this.model, "__ob__", this); + } + } + + Observer.prototype.walk = function walk(obj) { + return defineReactive(obj, this); + }; + + Observer.prototype.observeArray = function observeArray(items) { + for (var i = 0, l = items.length; i < l; i++) { + var ob = observe(items[i], this, i); + items[i] = ob ? ob.model : items[i]; + } + return items; + }; + + return Observer; + }(); + + function protoAugment(target, src, keys) { + /* eslint-disable no-proto */ + target.__proto__ = src; + /* eslint-enable no-proto */ + } + + /* istanbul ignore next */ + function copyAugment(target, src, keys) { + for (var i = 0, l = keys.length; i < l; i++) { + var key = keys[i]; + target[key] = src[key]; + } + } + + function observe(value, parentObserver, parentKey) { + if (!_.isObject(value)) { + return; + } + var ob = void 0; + if (value.__ob__ instanceof Observer) { + ob = value.__ob__; + } else if (observerState.shouldConvert && isExtensible(value) && (_.isArray(value) || isPlainObject(value))) { + ob = new Observer(value); + } + if (ob) { + ob.parent = parentObserver || ob.parent; + ob.parentKey = parentKey; + } + return ob; + } + + function notify(observer, key, dep, refresh) { + dep.notify({ observer: observer, key: key, refresh: refresh }); + if (observer) { + //触发a.*绑定的依赖 + _.each(observer._deps, function (dep) { + dep.notify({ observer: observer, key: key }); + }); + //触发a.**绑定的依赖 + var parent = observer, + root = observer, + route = key || ""; + while (parent) { + _.each(parent._scopeDeps, function (dep) { + dep.notify({ observer: observer, key: key }); + }); + if (parent.parentKey != null) { + route = parent.parentKey + '.' + route; + } + root = parent; + parent = parent.parent; } - }; - - Watcher.prototype.teardown = function teardown() { - if (this.active) { - // remove self from vm's watcher list - // this is a somewhat expensive operation so we skip it - // if the vm is being destroyed. - remove(this.vm._watchers, this); - var i = this.deps.length; - while (i--) { - this.deps[i].removeSub(this); + for (var _key2 in root._globalDeps) { + var reg = new RegExp(_key2); + if (reg.test(route)) { + root._globalDeps[_key2].notify({ observer: observer, key: _key2 }); } - this.active = false; } - }; - - return Watcher; - }(); + } + } - var seenObjects = new Set(); + function defineReactive(obj, observer, shallow) { + var props = {}; + var model = void 0; + // if (typeof Proxy === 'function') { + // const deps = {}, childObs = {}, cache = {} + // _.each(obj, function (val, key) { + // if (key in $$skipArray) { + // return + // } + // cache[key] = val + // const dep = deps[key] = (observer && observer['__dep' + key]) || new Dep() + // observer && (observer['__dep' + key] = dep) + // childObs[key] = !shallow && observe(val, observer, key) + // }) + // return model = new Proxy(props, { + // has: function (target, key) { + // return key in obj; + // }, + // get: function (target, key) { + // if (key in $$skipArray) { + // return target[key] + // } + // const value = cache[key] + // if (Dep.target) { + // deps[key].depend() + // if (childObs[key]) { + // childObs[key].dep.depend() + // if (_.isArray(value)) { + // dependArray(value) + // } + // } + // } + // return value + // }, + // set: function (target, key, newVal) { + // if (key in $$skipArray) { + // return target[key] = newVal + // } + // const value = cache[key], dep = deps[key] + // if (newVal === value || (newVal !== newVal && value !== value)) { + // return newVal + // } + // cache[key] = newVal + // childObs[key] = !shallow && observe(newVal, observer, key) + // obj[key] = childObs[key] ? childObs[key].model : newVal + // notify(model, key, dep) + // return obj[key] + // } + // }) + // } + _.each(obj, function (val, key) { + if (key in $$skipArray) { + return; + } + var configurable = isConfigurable(obj, key); + var dep = observer && observer['__dep' + key] || new Dep(); + observer && (observer['__dep' + key] = dep); + var childOb = configurable && !shallow && observe(val, observer, key); + props[key] = { + enumerable: true, + configurable: true, + get: function reactiveGetter() { + var value = childOb ? childOb.model : val; + if (Dep.target) { + dep.depend(); + if (childOb) { + childOb.dep.depend(); + if (_.isArray(value)) { + dependArray(value); + } + } + } + return value; + }, + set: function reactiveSetter(newVal) { + var value = childOb ? childOb.model : val; + if (newVal === value || newVal !== newVal && value !== value) { + return; + } + val = newVal; + childOb = configurable && !shallow && observe(newVal, observer, key); + if (childOb && value && value.__ob__) { + childOb._scopeDeps = value.__ob__._scopeDeps; + childOb._deps = value.__ob__._deps; + } + obj[key] = childOb ? childOb.model : newVal; + notify(model.__ob__, key, dep); + } + }; + }); + return model = createViewModel$1(obj, props); + } - function traverse(val) { - seenObjects.clear(); - _traverse(val, seenObjects); + /** + * Set a property on an object. Adds the new property and + * triggers change notification if the property doesn't + * already exist. + */ + function set(target, key, val) { + if (_.isArray(target)) { + target.length = Math.max(target.length, key); + target.splice(key, 1, val); + return val; + } + if (_.has(target, key)) { + target[key] = val; + return val; + } + var ob = target.__ob__; + if (!ob) { + target[key] = val; + return val; + } + ob.value[key] = val; + target = defineReactive(ob.value, ob); + notify(ob, key, ob.dep); + return target; } - function _traverse(val, seen) { - var i = void 0, - keys = void 0; - var isA = _.isArray(val); - if (!isA && !_.isObject(val)) { + /** + * Delete a property and trigger change if necessary. + */ + function del(target, key) { + if (_.isArray(target)) { + target.splice(key, 1); return; } - if (val.__ob__) { - var depId = val.__ob__.dep.id; - if (seen.has(depId)) { - return; - } - seen.add(depId); + var ob = target.__ob__; + if (!_.has(target, key)) { + return; } - if (isA) { - i = val.length; - while (i--) { - _traverse(val[i], seen); - } - } else { - keys = _.keys(val); - i = keys.length; - while (i--) { - _traverse(val[keys[i]], seen); + if (!ob) { + delete target[key]; + return target; + } + delete ob.value[key]; + target = defineReactive(ob.value, ob); + notify(ob, key, ob.dep); + return target; + } + + /** + * Collect dependencies on array elements when the array is touched, since + * we cannot intercept array element access like property getters. + */ + function dependArray(value) { + for (var e, i = 0, l = value.length; i < l; i++) { + e = value[i]; + e && e.__ob__ && e.__ob__.dep.depend(); + if (_.isArray(e)) { + dependArray(e); } } } @@ -1116,49 +1116,42 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons function initComputed(vm, computed) { var watchers = vm._computedWatchers = {}; - defineComputed(vm, computed); - for (var key in computed) { - var userDef = computed[key], - context = vm.$$model ? vm.model : vm; - var getter = typeof userDef === "function" ? _.bind(userDef, context) : _.bind(userDef.get, context); + watchers[key] = defineComputedWatcher(vm, computed[key]); + } + } - watchers[key] = new Watcher(vm.$$computed, getter || noop, noop, computedWatcherOptions); + function defineComputedWatcher(vm, userDef) { + var context = vm.$$model ? vm.model : vm; + var getter = typeof userDef === "function" ? userDef : userDef.get; + + return new Watcher(context, getter || noop, noop, computedWatcherOptions); + } + + function defineOneComputedGetter(vm, key, userDef) { + var shouldCache = true; + var sharedPropertyDefinition = { + enumerable: true, + configurable: true, + get: noop, + set: noop + }; + if (typeof userDef === "function") { + sharedPropertyDefinition.get = createComputedGetter(vm, key); + sharedPropertyDefinition.set = noop; + } else { + sharedPropertyDefinition.get = userDef.get ? shouldCache && userDef.cache !== false ? createComputedGetter(vm, key) : userDef.get : noop; + sharedPropertyDefinition.set = userDef.set ? userDef.set : noop; } + return sharedPropertyDefinition; } function defineComputed(vm, computed) { var props = {}; - // if (typeof Proxy === 'function') { - // return vm.$$computed = new Proxy(props, { - // has: function (target, key) { - // return computed && key in computed - // }, - // get: function (target, key) { - // return createComputedGetter(vm, key)() - // } - // }) - // } - var shouldCache = true; for (var key in computed) { if (!(key in vm)) { - var sharedPropertyDefinition = { - enumerable: true, - configurable: true, - get: noop, - set: noop - }; - var userDef = computed[key]; - if (typeof userDef === "function") { - sharedPropertyDefinition.get = createComputedGetter(vm, key); - sharedPropertyDefinition.set = noop; - } else { - sharedPropertyDefinition.get = userDef.get ? shouldCache && userDef.cache !== false ? createComputedGetter(key) : userDef.get : noop; - sharedPropertyDefinition.set = userDef.set ? userDef.set : noop; - } - - props[key] = sharedPropertyDefinition; + props[key] = defineOneComputedGetter(vm, key, computed[key]); } } vm.$$computed = createViewModel$1({}, props); @@ -1419,6 +1412,12 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons return Model; }(); + function define(model) { + return REACTIVE ? new Observer(model).model : model; + } + + var reactive = define; + function config(options) { options || (options = {}); if ("reactive" in options) { @@ -1446,16 +1445,14 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons return result; } - function define(model) { - return new Observer(model).model; - } var version = '2.0'; - exports.define = define; exports.version = version; exports.$$skipArray = $$skipArray; exports.mixin = mixin; exports.Model = Model; + exports.define = define; + exports.reactive = reactive; exports.config = config; exports.observerState = observerState; exports.Observer = Observer;