javascript - jsx 和 React 中的动态标签名称不传递 props

Question

关注Dynamic tag name in jsx and React
我尝试了两个建议的答案，但它们似乎都没有通过任何 Prop !!
(这是此问题的一个示例)[https://codesandbox.io/s/angry-torvalds-x7hcv?fontsize=14]
我做错了什么？
这是另一个例子，它不像上面的例子那样最小，使用 React.createElement ，它也不能正常工作，而且似乎没有传递任何 Prop

outputElement = React.createElement(
  `${this.props.UI_Element.type}`,
  {
    ...globalRequiredProperties,
    ...this.props.UI_Element.config
  },
  ...UIChildren
)  

简而言之，我的最终目标是创建一个导入的组件，仅通过其类型(或您可能会说的名称)动态创建。
更新01:
经过不断的寻找，我找到了另一种方法，它使用一个数组，在其中将字符串映射到实际的组件，然后创建一个使用该映射来调用组件的标签
Here is an example
这似乎正常工作，但我仍然想避免手动创建 map ，这意味着我仍然希望仅使用 string 创建组件!，有没有办法做到这一点？

Answer 1

我正在寻找一种方法，不仅可以动态导入组件，还可以动态创建它，但这无法实现如何创建动态标签，在寻找了一段时间后，我发现了一个库，它完全可以做到这一点! !
该图书馆名为react-loadable
Here is an example
正如您所看到的，导入、组件标签和其他所有内容都是按照我想要的方式动态创建的，希望这对其他人也有帮助。