vue3 之 h函数 用法

h() 函数用于辅助创建虚拟 DOM 节点，它是 hypescript 的简称————能生成 HTML (超文本标记语言) 的 JavaScript，它有另外一个名称，叫做 createVnode()。

h()函数接收参数如下：

• type：类型参数，必填。内容为字符串或者 Vue 组件定义。
• props：props参数，非必填。传递内容是一个对象，对象内容包括了即将创建的节点的属性，例如 id、class、style等，节点的事件监听也是通过 props 参数进行传递，并且以 on 开头，以 onXxx 的格式进行书写，如 onInput、onClick 等。
• children：子节点，非必填。内容可以是文本、虚拟 DOM 节点和插槽等等。

 const AsideLeft = h('div', { class: 'a-layout-aside-left' }, [
      h('div', { ref: resizeLeftRef, class: 'a-layout-resize-left' }),
      h('div', { class: isFirefox ? `a-layout-line-left${showBar.left ? ' active' : ''}` : 'a-layout-line-left' }),
      h('div', { class: 'a-layout-content-left' }, slots.left()),
    ]);