h

创建一个 VNode 节点,返回值为一个普通的对象。可以直接运行在浏览器,主要用来在非编译环境下编写应用。

参数

  • type: VNodeType - 要创建的节点类型,可以是标签名或者一个函数。
  • props: string | VNodeProps - 可以是字符串或者对象,如果是字符串则会当作children
  • children: Children | Children[] - 子节点。可以是 VNode 节点或者字符串。

返回值

一个 VNode 节点。

类型声明

declare function h(
  type: VNodeType,
  props?: string | VNodeProps,
  children?: Children | Children[]
): VNode

示例

import { h } from 'gyron'

const App = h(() => {
  return h('div', 'hello world')
})

nextRender

等待数据渲染完成,在下一个刻度中可以获取到更新后的 DOM 节点。

参数

  • fn: Noop - 回调函数,渲染完成后触发。

返回值

返回一个 Promise。

类型声明

declare function nextRender(fn?: Noop): Promise<unknown>

示例

import { h, useValue, nextRender, createRef, onAfterMount } from 'gyron'

const App = h(() => {
  const count = useValue(0)
  const ref = createRef()

  onAfterMount(() => {
    count.value++
    nextRender().then(() => {
      console.log(ref.current.innerText) // 1
    })
    console.log(ref.current.innerText) // 0
  })
  return () => h('div', { ref }, count.value)
})