一，抛出问题
在最开始学习vue时，我们习惯性的使用如下写法：
var em = new Vue({
el: '#app',
data: {
name: 'zxd'
}
})
后面学习了脚手架后，就会发现，内部的写法变成了：
new Vue({
render: h => h(App),
}).$mount('#app')
那么，这个render有什么用呢，这就是本节探索的内容。
二，带入一开始的写法看报错
new Vue({
el: '#app',
template: `<App></App>`,
components: {
App}
})
要探索render，我们则先不写render，写上原来的写法，看一看浏览器的报错：
vue.runtime.esm.js?c320:4605 [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
大致内容是说，现在用的不是完整的vue文件，模板无法正常渲染。
三，关于不同版本的Vue
vue.js是完整版的Vue，包含了核心功能+模板解析器，而vue.runtime.js是运行版本的vue，只包含核心功能，无模板解析器。
因为vue.runtime.xxx.js没有模板解析器，所以不能使用template配置项。
而我们平时在生产过程中使用的不是完整版的vue.js。原因：使用完整版本的vue.js在项目完成后打包的内容会更大，更占空间，有很多冗余代码。
四，render是什么
当未使用render时，浏览器告诉我们是因为使用了不完整版本的vue所以无法正常运行。所以可以猜测，render的作用是为了弥补不完整版本vue.js的功能：模板解析。
那么，render是什么呢？render的本质是一个函数。
我们先把render写成一个函数，并返回一个值：
new Vue({
el: '#app',
render(h) {
console.log(typeof h)
return null
}
})
在浏览器上运行可知，render函数会被调用且参数是一个function类型。
这个函数名字叫做createElement，用于为模板指定具体内容。
因为是形参，所以也可以写成字母，这里用h简写。
new Vue({
el: '#app',
render(createElement) {
return createElement('h1','你好')
}
})
大家可以代入上述代码去实验，最后发现，页面出现的就是h1标签的你好。
五，render的简写
我们先把形参用h代替：
new Vue({
el: '#app',
render(h) {
return h('h1','你好')
}
})
由于render中没有用到this，所以可以把render写成箭头函数（箭头函数this指向声明时所在的作用域下的this的值）；由于只有一个参数，所以可以省略括号；由于只有一行代码，所以可以省略return，箭头后面的内容就是这一行代码，简写如下：
new Vue({
render: h => h(App),
}).$mount('#app')
简写后就是一开始的写法了。
这里想带大家复习一下箭头函数的简写：
1.若形参只有一个，则小括号可以省略；
2.函数体只有一条语句，则花括号可以省略，函数的返回值为该条语句的执行结果；
后记
本篇博客讲述了render的写法，并未读者普及了vue文件的完整性以及复习了箭头函数的一些用法。
后期会产出更精品的内容，欢迎大家关注我！