码迷,mamicode.com
首页 > 其他好文 > 详细

Vue源码之 $set

时间:2019-08-22 10:47:51      阅读:83      评论:0      收藏:0      [点我收藏+]

标签:tar   declare   cti   undefined   com   count   eve   dep   源码   

v-model属性在render函数中是下面这样的

on: {
    "input": function($event) {
        if ($event.target.composing) return;
        $set(obj, "name", $event.target.value)
    }
}

意思也就是,第一次input事件的时候,调用$set,而set

 

function set (target, key, val) {
        if (isUndef(target) || isPrimitive(target)
        ) {
            warn(("Cannot set reactive property on undefined, null, or primitive value: " + ((target))));
        }
        if (Array.isArray(target) && isValidArrayIndex(key)) {
            target.length = Math.max(target.length, key);
            target.splice(key, 1, val);
            return val
        }
        if (key in target && !(key in Object.prototype)) {
            target[key] = val;
            return val
        }
        var ob = (target).__ob__;
        if (target._isVue || (ob && ob.vmCount)) {
            warn(
                ‘Avoid adding reactive properties to a Vue instance or its root $data ‘ +
                ‘at runtime - declare it upfront in the data option.‘
            );
            return val
        }
        if (!ob) {
            target[key] = val;
            return val
        }
        defineReactive$$1(ob.value, key, val);
        ob.dep.notify();
        return val
    }

注意红色字体,所以用v-model的话,没必要再在初始化的时候用$set绑定属性,但是注意紫色字体,不要在input事件之前给obj.name赋值,否则不会响应,非要赋值就提前用$set赋值

Vue源码之 $set

标签:tar   declare   cti   undefined   com   count   eve   dep   源码   

原文地址:https://www.cnblogs.com/chuliang/p/11392736.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!