Vue2 双向数据绑定(三)-- 订阅者构造函数

发布日期:2019-06-09 阅读量:366

1. 订阅者

    /**
     * 订阅者构造函数
     * @param vm 虚拟dom
     * @param exp 绑定属性
     * @param cb 回调函数
     */
    function Watcher(vm, exp, cb){
         this.vm = vm;
         this.exp = exp;
         this.cb = cb;
         this.value = this.get();
    }
    Watcher.prototype = {
        update: function() { // 更新
            this.run();
        },
        run: function() {
            var val = this.vm.data[this.exp]; // data上的数据
            var oldVal = this.value; // 当前数据
            if (val!== oldVal) { // 如果不相等
                this.value = value; // 更新数据
                this.cb.call(this.vm, val, oldVal);
            }
        },
        get: function() {
            Dep.target = this; // 缓存自己
            var value = this.vm.data[this.exp];
            Dep.target = null; // 释放自己
            return value;
        }
    };