Vue3+TSX开发模式下内置组件的替代方案

问题：

开发模式为 Vue3+TSX, 无法通过Vue的内置组件实现动态组件,代码为：

import { defineComponent } from 'vue'
import Comp1 from './components/xxx'

export default defineComponent({
  name: 'App',
  components: {
    xxx
  },
  setup (){
    
    return {}
  },
  render() {
    return (
      <component is={ 'Comp' }></component>
    )
  }
})

可是却未能生效，且有以下提示，大概意思就是组件没有注册，但是不知道在哪里引入vue的内置组件：

原因：

以下内容摘自文档

和 is
在底层实现里，模板使用 resolveDynamicComponent 来实现 is attribute。如果我们在 render 函数中需要 is提供的所有灵活性，我们可以使用同样的函数：

const { h, resolveDynamicComponent } = Vue

// ...

// ``
render() {
  const Component = resolveDynamicComponent(this.name)
  return h(Component)
}

就像 is, resolveDynamicComponent 支持传递一个组件名称、一个 HTML 元素名称或一个组件选项对象。

通常这种程度的灵活性是不需要的。通常resolveDynamicComponent 可以被换做一个更直接的替代方案。

例如，如果我们只需要支持组件名称，那么可以使用resolveComponent来代替。

如果 VNode 始终是一个 HTML 元素，那么我们可以直接把它的名字传递给 h：

// ``
render() {
  return h(this.bold ? 'strong' : 'em')
}

同样，如果传递给 is 的值是一个组件选项对象，那么不需要解析什么，可以直接作为 h 的第一个参数传递。

与