渲染：vue 的模板如何被解析

了解一下vdom

首先需要简单了解一下vdom和render函数的关系

• vdom api 分为首次渲染和更新渲染

  
  vdom .png

image.png

• 仔细一看 vm_c和h函数怎么长的差不多，其实vue就是修改了snabbdom里边的api自己实现了一遍，就是名字不一样而已

• 对比 vdom和vue的render函数

  
  对比.png
  render.png
• 渲染 核心函数 updateComponent

理解vdom，就理解了vue的模板渲染
render函数返回的就是vnode
vnode渲染用patch，分为两种，第一次和第二次对比

image.png
image.png

---

                                🤠你的鼓励对我很重要，会激励我写出更加优秀的文章🤠

鼓励.png