vue渲染render过程，涉及模板template、虚拟DOM等

作为一个vue初级使用者，对于vue的渲染过程可能会比较疑惑。我会存在这样一个问题：每次看相关知识都觉得自己会了，然而再经过一段时间，又感觉不会了。总结一下，问题在于没有对这个问题形成一个整体的认知全貌，全是零散的知识汇总。所以这篇文章就尽量通过简单易懂的话语概括一下vue渲染的基本过程。我主要从B站、深入浅出Vue.js书籍、CSDN博客等学习该内容。

---

将“状态”作为输入，并生成DOM输出到页面上显示出来，这个过程叫做渲染

上面这句话很好理解，但什么是状态呢？状态可以是JS中的任意类型，Object、Array、String、Number、Boolean等都可以作为状态，这些状态可能最终会以段落、表单、链接或按钮等元素呈现在用户界面上，具体地说是呈现在页面上。可以粗略地理解为将数据呈现在页面上

在Vue.js中，使用模板来描述状态与DOM之间的映射关系。再结合上述的定义，可以得出“模板”和“渲染过程”是相关的。也就是说怎么根据模板去进行渲染操作呢？其过程如下图所示：