首页 > 其他 > 详细

vue学习笔记runtime-only和runtime-compiler

时间:2020-01-07 15:39:02      阅读:83      评论:0      收藏:0      [点我收藏+]

一、vue内部过程 

  1.首先将vue中的模板进行解析解析成abstract syntax tree (ast)抽象语法树
  2.将抽象语法树在编译成render函数
  3.将render函数再翻译成virtual dom 虚拟dom
  4.将虚拟dom显示在浏览器上
 
二、runtime-only和runtime-compiler的区别
  runtime-only比runtime-compiler更快,因为它省略了vue内部过程中的第一个过程,如果是runtime-compiler
  那么main.js中就会出现template从而需要过程一导致增加了一个过程,同时增加了大小
 
三、runtime-only中的render函数
render函数
render:function(createElement){
    //1.createElement(‘标签‘,{标签的属性},[标签中的内容])
    returncreateElement(‘h2‘,{class:‘box‘},[‘hello word‘])
}
render传入组件
render:function(createElement){
    //1.createElement(‘标签‘,{标签的属性},[标签中的内容])
    returncreateElement(组件对象)
}
//那么.vue文件中的template是又谁处理的了?
是由vue-template compier处理的

vue学习笔记runtime-only和runtime-compiler

原文:https://www.cnblogs.com/LazyPet/p/12161809.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!