添加字体真棒图标+文本给我错误答案

【问题标题】：Adding FontAwsome Icon + Text gives me error添加字体真棒图标+文本给我错误
【发布时间】：2019-09-01 19:24:42
【问题描述】：

我有这个带有 textArea 的方法：

 DropdownExampleClearable = () => <Dropdown placeholder="Status" clearable options={options} selection />

这是它拥有的选项：

const options = [
 { key: 1, text: (<i className="far fa-edit"/> + "OK"), value: 1 },
 { key: 2, text: <i className="far fa-edit"/>, value: 2 },
]

第一个键会显示'[Object object]OK'

第二个键将显示所需的图标，但如果我添加任何文本，图标将不再显示。

任何关于如何让图标+文本显示的建议将不胜感激。

【问题讨论】：

标签： javascript reactjs font-awesome

【解决方案1】：

JSX is just sugar for React.createElement calls，所以你不能用+ "OK"添加字符串。

您可以改为将图标和文本包装在另一个 React 元素中并使用它。

const options = [
  { key: 1, text: <span><i className="far fa-edit" /> OK</span>, value: 1 },
  { key: 2, text: <i className="far fa-edit" />, value: 2 }
]

【讨论】：

【解决方案2】：

试试这个

  <p> <i className="far fa-edit"> OK </i>  </p>

【讨论】：