一、参数设置

h函数接收三个参数。

第一个参数:，可以为一个html标签，一个组件，一个异步组件，或者是一个函数式组件。

第二个参数：{ Object } Props，与attributes和props,以及事件对应的对象，我们可以在模板中使用，如果没有需要传入的属性，可以设置为null。

第三个参数：{String | Object |Array}可以是字符串Text文本或者是h函数构建的对象再者可以是有插槽的对象。

二、基本使用

return () => h('div', {class: 'demo'}, 'hello')

上面会返回一个div标签，<div class="demo">hello</div>。

如果要添加点击事件：

return () => h('div', {class: 'demo',onClick: closeDiv}, 'hello')

很多的属性都可以加到第二个参数中去。

如果需要多个标签或者组件嵌套：

return () => h('div', {class: 'demo'}, [
                h(Space, {}, [
                    h(Button, {size: 'small',onClick: closeDivCancel}, '取消'),
                    h(Button, {size: 'small', type: 'primary', onClick:delFunction(item,index)}, '确定')，
                    h(ABC, {}, {
                        default:props=>h('h3',{},‘你好’)，// 默认插槽
                        test:props=>h('h3',{},‘test’)，// 叫test的插槽
                    })
                ]),
            ])

这段代码创建了一个div，div中引入了一个space组件，组件中引入了两个button组件。组件分给配置了点击事件，大小等。用第三个参数传入h函数数组的方式实现。

arco design 框架中 Model.warning设置了cancelText无效，只能用footer插槽来实现，结合h函数：

delDiv.value = Modal.warning({
        title: '温馨提示',
        content: '您确定要删除该数据吗？',
        okText: '确定',
        cancelText: '取消',
        footer:(
            () => h('div', {class: 'info-modal-content'}, [
                h(Space, {}, [
                    h(Button, {size: 'small',onClick: closeDivCancel}, '取消'),
                    h(Button, {size: 'small', type: 'primary', onClick:delFunction(item,index)}, '确定')
                ]),
            ])
        )
    });