在蚂蚁设计中将渲染字符串作为 HTML 反应

Question

我正在使用蚂蚁设计下拉菜单。我有来自 API 的动态数据，当我尝试将这些数据呈现到下拉菜单中时，它呈现为字符串。

所以我使用这个react-html-parser库将字符串呈现为 HTML，但它不起作用。

renderSocialMedia = () => {

if (this.props.weblookup) {

  let socialmedialookup = this.props.weblookup

  webitems = ""

  return socialmedialookup.map((k, index) => {

    if (k.name.toLowerCase() != "other")

      return webitems = "<Menu.Item key=" + k.id + ">" + k.name + "</Menu.Item>"

  })

 }

}

{ReactHtmlParser(webitems)}

<FormItem>

 {getFieldDecorator('AddNetwork', {

  initialValue: "",

 })(

 <Dropdown overlay={

  <Menu onClick='{this.handleMenuClick}'>

    <div>{ReactHtmlParser(webitems)}</div>

  </Menu>

} trigger={['click']}>

 <a className="ant-dropdown-link" href="#">

  Add Username 

  <Icon type="down" />

 </a>

</Dropdown>

)}

输出：

Answer 1

当你使用 React 时，你必须正确地格式化一个 DOM 元素。所以，试试这个，return&nbsp;webitems&nbsp;=&nbsp;<Menu.Item&nbsp;key={&nbsp;k.id&nbsp;}>{&nbsp;k.name}</Menu.Item>希望能帮助到你。快乐编码！