渲染过程

来源:2-8 update

前端工程师666777888

2021-04-01

简述整个渲染过程
1、初始化完成后,执行vm.$mount()开始挂载节点
2、在vm.$mount()中会生成一个render函数。接下来在new Watcher()时会执行这个生成的render函数
3、在执行render函数时,会生成vnode。
  在生成vnode时,如果遇到了自定义组件A,则会停止继续生成这个vnode
4、开始执行这个自定义组件的$mount()方法,生成组件A的render函数,在new Watcher()时执行组件A的render函数,生成组件A的vnode,组件A的vnode生成后,执行组件A的_update()把组件A的vnode变成真实dom
5、接下来继续生成上面停止的vnode,生成vnode后,执行_update(),完成渲染

请问老师是这样吗?

写回答

1回答

ustbhuangyi

2021-04-02

第三步不对,vnode 已经生成好了,在后面 patch 阶段的 createElm 过程中,如果遇到组件 vnode,会递归执行子组件的创建过程。

0
1
狂奔的小猪包
生成vnode不是在render过程中吗?patch阶段,vnode已经生成完成了吧
2021-11-25
共1条回复

Vue.js 源码深入解析 深入理解Vue实现原理

全方位讲解 Vue.js 源码,进阶高级工程师

4986 学习 · 1038 问题

查看课程