React - 如何将对象中的图标指定为值

Question

我之前有一个包含对象的数组，我应用了 fontAwesome 的图标作为值，它看起来像这样

const SideBarColors = [
   {
        IconStyle: {
            Icon: faDotCircle,
        }
   }
]

然后在另一个组件中我得到了这样的图标

<FontAwesomeIcon icon={SideBarStyle.Icon} />

现在我使用不同的方法（React Icons），关键是现在我用这种方式创建图标

<BsBraces />

在这种情况下，我无法将对象内的这个图标赋值，它会报错

IconStyle: {
    IconTitle: <BsBraces />
}

遇到这种情况怎么办？

Answer 1

您只需要：

IconStyle: {
    IconTitle: BsBraces
}

没有 </>

像这样将其应用于 JSX：

<IconStyles.IconTitle />

React - How to specify an icon in an object as a value