vue3中使用render函数

render

​

​render()​

​​函数中重要的是使用​

​h()​

​​函数。这个h函数返回的是一个JavaScript对象，而不是一个DOM元素。返回的对象中包括页面上渲染的节点类型信息和任何子节点的描述。就是我们​

​VNode​

​也称为虚拟节点。我们使用这个函数的作用就是创建虚拟节点。接收3个参数，第一个参数可以是对象、字符串或者函数对象(一个HTML标签名、组件或异步组件，或者任何一种的一个async()函数)。但是第一个参数必须填写，不能省略。第二个参数用来表示与模板中元素属性对应的数据对象(包括普通属性、props和事件属性或者对应数据对象)。这个参数是可选的。第三个参数用来生成虚拟节点(子虚拟节点由h()函数构建，或者使用字符串生成文本虚拟节点，或者带有插槽的对象)，这个参数可以是字符串、数组或者对象。参数也是可选的。

render() {
    return Vue.h('p', Array.apply(null, { length: 6 }).map(() => {
        return Vue.h('p', 'zss');
    }))
}      

import Tear form './Tear.vue'
const app = createApp({
    render() {
        <Tear level={4}>
            <h1>zss</h2>
        </Tear>
    }
})