我正在尝试在列表中的字符串中呈现带有 html 标签的 json 列表,如下所示jsbin。它适用于 Jsbin。但是在我的控制台中,我收到了以下警告:
warning Only set one of `children` or `props.dangerouslySetInnerHTML` react/no-danger-with-children
只是想知道是否有其他方法可以使用危险的SetInnerHTML 呈现列表以避免警告?
const displayList = [
{
item: 1,
text: "<strong>ABC</strong> this should be strong."
},
{
item: 2,
text: "<a>ABC</a> this should be link."
},
{
item: 3,
text: "normal text"
}
];
const App = () => (
<ul>
{displayList.map((item, i) => (
<li key={i}>
<div dangerouslySetInnerHTML={{
__html: item.text
}}>
</div>
</li>
))}
</ul>
);
ReactDOM.render(
<App />,
document.getElementById('root')
);