Vue2系列 — 渲染函数 (render + createElement)
官网文档：https://v2.cn.vuejs.org/v2/guide/render-function.html
1 render 函数
render 函数
不使用模板，使用 js 生成虚拟 dom
2 createElement()
接受的参数：
- 参数1 节点类型
- 参数2 attribute
- 参数3 子节点
3 DEMO
<template><div class="container"><!-- <WangEditorDemo></WangEditorDemo> --><!-- <div v-hello>123</div> --><!-- <input v-limit-input-number> --><!-- <el-input v-model="name" v-limit-input></el-input> --><!-- <IDBDemo></IDBDemo> --><anchored-heading :level="1">Hello world!</anchored-heading><anchored-heading :level="2">Hello world!</anchored-heading></div>
</template>
main.js
Vue.component('anchored-heading', {render: function (createElement) {return createElement(// 参数1 节点类型 {String | Object | Function}'h' + this.level, // 标签名称// 参数2 attribute {Object} 可选{'class': {foo: true},style: {color: 'red'},},// 参数3 子节点 {String | Array} 可选'123' // 文本节点)},props: {level: {type: Number,required: true}}
})
4 使用 JavaScript 代替模板功能(v-if/v-for/v-model…)
官方文档：https://v2.cn.vuejs.org/v2/guide/render-function.html