以给div添加contentEditable属性后,react提示错误,需要添加suppressContentEditableWarning属性,才能屏蔽错误提示。
通常,当带有子元素的元素也被标记为contentEditable时会出现警告,因为它不起作用。此属性将取消显示该警告。除非你正在构建一个像Draft.js这样的库来手动管理contentEditable,否则不要使用它。
还有一种方法是使用dangerouslySetInnerHTML.
dangerouslySetInnerHTML是React在浏览器DOM中使用innerHTML的替代品。通常,从代码中设置HTML是有风险的,因为它很容易在不经意间让用户受到跨站点脚本(XSS)攻击。因此,您可以直接从React设置HTML,但必须键入dangerouslySetInnerHTML并传递带有__HTML键的对象,以提醒自己这是危险的。
function createMarkup() {
return {__html: 'First · Second'};
}
function MyComponent() {
return <div dangerouslySetInnerHTML={createMarkup()} />;
}