【面试题】用过vue 的render吗? render和template有什么关系

render和template

• template----html的方式做渲染
• render----js的方式做渲染
• render（提供）是一种编译方式
• render里有一个函数h，这个h的作用是将单文件组件进行虚拟DOM的创建，然后再通过render进行解析。
• h就是createElement()方法：createElement(标签名称,属性配置,children) template也是一种编译方式，但是template最终还是要通过render的方式再次进行编译。

区别

• render渲染方式可以让我们将js发挥到极致，因为render的方式其实是通过createElement()进行虚拟DOM的创建。逻辑性比较强，适合复杂的组件封装。
• template是类似于html一样的模板来进行组件的封装。
• render的性能比template的性能好很多
• render函数优先级大于template

使用

new Vue({
  // 元素 element
  el: '#app',
  render(h){
      // 创建一个div 里面是 n
    return h('div', this.n)
  },
  data: {
    n: 0
  }
})

new Vue({
  // 元素 element
  el: '#app',
  template: `
    <div>{{n}}</div>
  `,
  data: {
    n: 0
  }
})

原文地址：blog.csdn.net/qq_39384184…