核心思想:数据驱动和组件化
数据驱动:
- 初始化---模板和数据如何渲染成最终的 DOM
template->parse编译成AST语法树 -> 再转换为render函数->最终返回一个VNode->patch->DOM
初始化 Vue 到最终渲染的整个过程
parse
目标 | 把 templatxie 模板字符串转换成AST(抽象语法树),它是⼀种⽤ JavaScript 对象的形式来描述整个模板。 |
过程 | 利⽤正则表达式顺序解析模板,当解析到开始标签、闭合标签、⽂本的时候都会分别执⾏对应的回调函数,来达到构造 AST 树的⽬的。 |
-
AST : 源代码的抽象语法结构的树状表现形式。通俗来说是一种树结构,然后把js语句拆分成一个个零件,放入这棵树中。我们可以修改这棵树的节点,做些调整,再组装起来,就会变成另外的js语句了。
parse
-
组件更新---响应式原理
组件更新核⼼是新旧 vnode diff
网友评论