简而言之，就是先转化成AST树，再得到的render函数返回VNode(Vue的虚拟DOM节点)

详情步骤：

首先，通过compile编译器把template编译成AST语法树(abstract syntax tree 即源代码的抽象语法结构的树状表现形式)，compile是createCompiler的返回值，createCompiler是用以创建编译器的。另外compile还负责合并option；

然后，AST会经过generate(将AST语法树转化成render function字符串的过程)得到render函数，render的返回值是VNode，VNode是Vue的虚拟DOM节点，里面有（标签名、子节点、文本等等）；

对vue.js的template编译的理解的更多相关文章

  1. 聊聊Vue.js的template编译

    写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出. 文章的原地址:https://github.com/a ...

  2. Vue.js：template

    ylbtech-Vue.js: 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   7.返回顶部   8.返回顶部   9.返回顶部   1 ...

  3. 你应该要知道的vue.js

    前言 小组同事最近都在学习前端,目前我们小组前端技术栈主要是vue.在和同事交流过程成,发现他们对vue都不了解,所以整理了问的比较多的问题. 组件data为什么必须是函数? 因为组件可能被多处使用, ...

  4. vue.js面试题整理

    Vue.js面试题整理 一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务 ...

  5. web前端开发面试题（Vue.js）

    1.active-class是哪个组件的属性?嵌套路由怎么定义? 答:vue-router模块的router-link组件. 2.怎么定义vue-router的动态路由?怎么获取传过来的动态参数?  ...

  6. Vue.js面试题整理（转载）

    一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑:View 代表UI ...

  7. [ 转载 ] vue.js面试题一

    转载自:https://www.cnblogs.com/aimeeblogs/p/9501490.html 如有侵权 联系删除 Vue.js面试题整理 一.什么是MVVM? MVVM是Model-Vi ...

  8. Vue.js面试题

    一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑:View 代表UI ...

  9. 从template到DOM(Vue.js源码角度看内部运行机制)

    写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...

随机推荐

  1. Java知多少（75）Object类

    Object 类位于 java.lang 包中,是所有 Java 类的祖先,Java 中的每个类都由它扩展而来. 定义Java类时如果没有显示的指明父类,那么就默认继承了 Object 类.例如: p ...

  2. Android wpa_supplicant 四次握手 流程分析

    记录wpa_supplicant四次握手的过程. 相关log:https://www.cnblogs.com/helloworldtoyou/p/9633603.html 接收到第一次握手,会设置一个 ...

  3. java-信息安全（十四）-初探SSL

    原文地址 http://snowolf.iteye.com/blog/397693 我们需要构建一个由CA机构签发的有效证书,这里我们使用上文中生成的自签名证书zlex.cer     这里,我们将证 ...

  4. java-信息安全（六）-基于RSA理解数字签名示例

    概述 java-信息安全(四)-数据签名.数字证书 java-信息安全(五)-非对称加密算法RSA RSA工具类 使用java-信息安全(五)-非对称加密算法RSA项目中RSACoder 数字签名理解 ...

  5. Ubuntu 14.04 安装 Blender，并放桌面

    1.打开Blender官网 2.在主页点击down按钮,跳转到下载页面 3.根据自己的操作系统,选择合适的版本,这里使用的是ubunut 64位,所以下载Linux 64bit,保存文件,一般保存到h ...

  6. Android进阶——深入浅出Handler（一）

    Android进阶--深入浅出Handler(一) 在学习Handler之前,首先要学习一些基本概念,这将对之后的学习有所帮助. 主线程:Main Thread,又叫UI线程(UI Thread).A ...

  7. [Android Studio] Using API of OpenCV DNN

    前言 一.故事背景 NDK方法人脸识别 OpenCV4Android系列: 1. OpenCV4Android开发实录(1):移植OpenCV3.3.0库到Android Studio 2.OpenC ...

  8. [Algorithm] Maximum Flow

    Ref MIT: lecture-13-incremental-improvement-max-flow-min-cut/ Ford Fulkerson algorithm for finding m ...

  9. 【中间件安全】IIS7.0 安全加固规范

    1. 适用情况 适用于使用IIS7进行部署的Web网站. 2. 技能要求 熟悉IIS配置操作,能够利用IIS进行建站,并能针对站点使用IIS进行安全加固. 3. 前置条件 1. 根据站点开放端口.进程 ...

  10. 延续(continuation)

    首先看下延续的定义: 续延是在运行中被暂停了的程序:即含有计算状态的单个函数型对象.当这个对象被求值时,就会在它上次停下来的地方重新启动之前保存下来的计算 在计算机科学和程序设计领域,延续是计算机程序 ...