`h` 和 `createVNode` 一样吗?

Are `h` and `createVNode` the same?

hcreateVNode 都暴露于 vue

doc 似乎表明它们是相同的:

The h() function is a utility to create VNodes. It could perhaps more accurately be named createVNode().

但是切换 hcreateVNode 会抛出:

<script lang="ts">
  import { createVNode, defineComponent, h } from 'vue'

  export default defineComponent({
    setup() {
      // works
      return () => h('strong', 'Foo')

      // throws
      return () => createVNode('strong', 'Foo')
    },
  })
</script>

createVNode 已公开,但 h 是它的用户友好变体。如果你想直接调用 createVNode 你应该添加不同类型的参数,参见:

https://github.com/vuejs/vue-next/blob/060c5f1d0ae999cd8c8fb965e8526ffab17ac2d1/packages/runtime-core/src/vnode.ts#L326


    export const createVNode = (__DEV__
      ? createVNodeWithArgsTransform
      : _createVNode) as typeof _createVNode

    function _createVNode(
      type: VNodeTypes | ClassComponent | typeof NULL_DYNAMIC_COMPONENT,
      props: (Data & VNodeProps) | null = null,
      children: unknown = null,
      patchFlag: number = 0,
      dynamicProps: string[] | null = null,
      isBlockNode = false
    )

对于h

If there are no props then the children can usually be passed as the second argument.

你可以这样做:

h('strong', 'Foo')

对于createVNode,你必须做:

createVNode('strong', null, 'Foo')