渲染函数


Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中,你真的需要 JavaScript 的完全编程的能力。这时你可以用渲染函数,它比模板更接近编译器。

主要就是为了避免重复使用某些节点
比如我们想自己实现不同的标题来作为我们的模板

<h1>
  <a name="hello-world" href="#hello-world">
    Hello world!
  </a>
</h1>

我们用render函数来实现这个功能

Vue.component(\'anchored-heading\', {
  render: function (createElement) {
    return createElement(
      \'h\' + this.level,   // 标签名称
      this.$slots.default // 子节点数组
    )
  },
  props: {
    level: {
      type: Number,
      required: true
    }
  }
})

文章作者: 小游
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 小游 !
  目录