javascript - 在 React 中使用变量渲染组件

Question

我有一个列表 react-icons通过“卡片组件”中的 Prop 。在我的 Card 组件的渲染方法中，我有这样的东西:

render() {
  ...
  {
     this.props.icons.map(icon => {
        return (
          <div className="icon-square">
            /*   What should I do here so I render the "icon" variable"   */
          </div>
        )
     })
   }
}

注意:该列表由 React 组件本身的 react-icons 组成。
我尝试了很多东西，但我无法弄清楚如何渲染图标。如果有人可以帮助我，那就太棒了。谢谢

Answer 1

如果图标是 react 组件，则:

this.props.icons.map(Icon => {
        return (
          <div className="icon-square">
            <Icon/>
          </div>
        )
     })