Component的创建主要分为了两个流程
- 创建组件VNode
- 挂载组件DOM
<div>
<test></test>
</div>
上面这个页面被解析成了一个渲染函数
function() {
with(this) {
return _c('div', [
_c('test')
])
}
}
以上渲染函数执行得到模板对应的VNode,得到VNode之后,就会根据VNode创建DOM,然后进行挂载。此时Vue需要递归遍历VNode,进行DOM树的生成。
- 页面解析模板得到VNode时:创建组件构造函数+生成外壳节点保存父子关联的数据
- 页面开始挂载DOM时,新建组件实例,解析组件内部模板,生成DOM挂载到父页面