vue中我们一般会用模板来创建HTML,但是在有些情况也会需要用到渲染函数。
渲染函数是用来生成Virtual DOM的。Vue推荐使用模板来构建我们的应用界面,在底层实现中Vue会将模板编译成渲染函数。
render 函数即渲染函数,它接收一个 方法作为第一个参数用来创建 。(简单的说就是 render函数的参数也是一个函数)
createElement也是一个函数,它接受三个参数
【必填】一个 HTML 标签名、组件选项对象,或者resolve 了上述任何一种的一个 async 函数。类型:
【可选】一个与模板中 attribute 对应的数据对象。 类型:
【可选】子级虚拟节点 (VNodes) 类型:
将 作为 的别名是 Vue 生态系统中的一个通用惯例。
vue3的官方文档中,render的参数都是用h()来表示。
官网说: 函数是一个用于创建 VNode 的实用程序。也许可以更准确地将其命名为 ,但由于频繁使用和简洁,它被称为 h()
它接受三个参数:
- 【必填】一个 HTML 标签名、一个组件、一个异步组件、或一个函数式组件。类型:
- 【可选】与 attribute、prop 和事件相对应的对象。类型:
- 【可选】子 VNodes, 使用 h() 构建,或使用字符串获取 “文本 VNode” 或者有插槽的对象。类型:
如果没有第二个参数 prop,可以把第三个参数children作为第二个参数传入。
如果觉得会产生歧义,可以将将 null作为第二个参数传入,将 children 作为第三个参数传入。
简单的说就是: