知食记
搜索文档…
vue 渲染过程
    1.
    new Vue,执行初始化,将传入的data数据绑定到当前实例,就可以通过this.message的形式访问传入的数据。这个过程是执行initData()函数完成的。
    2.
    挂载$mount方法,通过自定义Render方法、template、el等生成Render函数。如果传入了模版(template)就将模版里面的内容编译成render函数,否则将传入的el对应的元素的内容编译成render函数。编译是调用compileToFunctions函数完成的。也可以自己手写render函数,可以减少编译这一环节。其中render渲染函数的优先级最高,template次之且需编译成渲染函数,而挂载点el属性对应的元素若存在,则在前两者均不存在时,其outerHTML才会用于编译与渲染。
    3.
    生成render函数后,调用_createElement函数生成vnode。
    4.
    将虚拟DOM映射为真实DOM页面上。
非常有用的参考:

Vue 组件为什么需要一个根元素?

最近更新 1yr ago