1.使用components 子组件进行局部的渲染
new Vue({ el:"#app",
components:{
login,//渲染在app元素中的Login子组件。
} })
2.使用render进行将el指定的整个元素都覆盖 和react中的render方法一样。
new Vue({ el:"#app", //即将整个app元素进行渲染 都渲染成了templateName的内容
render:function(createElement){ //createElement是一个函数 return createElement(templateName); } })
在使用脚手架vuecli的时候,有个runtime-compiler 和runtime-only的使用,在runtion comiler中使用的就是第一种的渲染方式,先将template==>ast (抽象语法树)==>render==>虚拟Dom==>真实的屏幕显示的UI.
runtime only是使用第二种方式进行渲染的:render==>虚拟Dom==>UI
所以runtime only 相对另一个来说相对轻量,性能也比较高,无需进行template的转换。