Vue有三个属性和模板有关，官网上是这样解释的:

el　　　　　;提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标

template　　;一个字符串模板作为 Vue 实例的标识使用。模板将会 替换 挂载的元素。挂载元素的内容都将被忽略，除非模板的内容有分发插槽。

render 　　;字符串模板的代替方案，允许你发挥 JavaScript 最大的编程能力。该渲染函数接收一个 createElement 方法作为第一个参数用来创建 VNode。www.bjyderp.com/yxbhl/105.html

简单说一下，就是:

Vue内部会判断如果没有render属性则把template属性的值作为模板，如果template不存在则把el对应的DOM节点的outerHTML属性作为模板,经过一系列正则解析和流程生成一个render函数，最后通过with(this){}来执行。

也就是说template的优先级大于el。www.quanxinlian.com/npxbw/84.html

render的参数是Vue内部的$createElement函数(位于4486行)，它的可扩展性更强一些，在一些项目的需求中，可以用很简单的代码得到一个模板。例如Vue实战9.3里介绍的例子，有兴趣可以看看

render可以带4个参数，分别如下:

tag　　　　      ;元素的标签名，也可以是组件名
data　　　　    ;该VNode的属性，是个对象
children   　　   ;子节点，是个数组

、其中参数2可以省略的，在4335行做了修正，最后执行_createElement()函数，如下:

复制代码。www.sxyuanmai.com/yxbhl/80.html
function createElement (　　//第4335行
context,
tag,
data,
children,
normalizationType,
alwaysNormalize
) {
if (Array.isArray(data) || isPrimitive(data)) { //如果data是个数组或者是基本类型
normalizationType = children;
children = data; //修正data为children
data = undefined; //修正data为undefined
}
if (isTrue(alwaysNormalize)) {
normalizationType = ALWAYS_NORMALIZE;
}
return _createElement(context, tag, data, children, normalizationType) 　　　　//最后执行_createElement创建一个虚拟VNode
}
复制代码

例如下面三个Vue实例，分别用el、template和rentder指定模板，它们的输出是一样的

复制代码