Function updateStyle

vue.js:10780–10830

(oldVnode, vnode)

    });
    // 将vonde虚拟dom的css 转义成并且渲染到真实dom的csszhong
    function updateStyle(oldVnode, vnode) {
        var data = vnode.data; //获取新虚拟dom的标签属性
        var oldData = oldVnode.data; //获取旧虚拟dom的标签属性

        if (isUndef(data.staticStyle) && isUndef(data.style) &&
            isUndef(oldData.staticStyle) && isUndef(oldData.style)
        ) {
            return
        }

        var cur, name;
        var el = vnode.elm; //获取真实的dom
        var oldStaticStyle = oldData.staticStyle; //获取旧的静态 staticStyle
        var oldStyleBinding = oldData.normalizedStyle || oldData.style || {}; //获取旧的动态style

        // if static style exists, stylebinding already merged into it when doing normalizeStyleData
        //  如果存在静态样式，则在执行normalizeStyleData时，stylebinding已经合并到其中
        var oldStyle = oldStaticStyle || oldStyleBinding; //旧的style样式


        //将可能的数组/字符串值规范化为对象 //把style 字符串 转换成对象 比如'width:100px;height:200px;' 转化成 {width:100px,height:200px}
        var style = normalizeStyleBinding(vnode.data.style) || {};

        // store normalized style under a different key for next diff
        // make sure to clone it if it's reactive, since the user likely wants
        // to mutate it.
        //为下一个diff在不同的键下存储规范化样式
        //如果它是反应性的，请确保克隆它，因为用户可能希望这样做
        //使之变异
        vnode.data.normalizedStyle = isDef(style.__ob__) ? //如果style 加入了观察者之后
            extend({}, style) :  //重新克隆,可以修改
            style; //直接赋值
        //getStyle循环子组件和组件的样式，把它全部合并到一个样式对象中返回 样式对象 如{width:100px,height:200px} 返回该字符串。
        var newStyle = getStyle(
            vnode,
            true
        );

        for (name in oldStyle) { //获取旧虚拟dom的样式
            if (isUndef(newStyle[name])) { // 如果新的虚拟dom vonde没有了
                setProp(el, name, ''); //则设置样式为空
            }
        }
        for (name in newStyle) { //循环新的虚拟dom vonde 样式
            cur = newStyle[name];
            if (cur !== oldStyle[name]) { //如果旧的和新的不同了 就设置新的样式
                // ie9 setting to null has no effect, must use empty string
                setProp(el, name, cur == null ? '' : cur);
            }
        }
    }

    var style = {
        create: updateStyle,