Don't pass HTML as a string to the 'dangerouslySetInnerHTML' property |
To specify HTML to render using the 'dangerouslySetInnerHTML' use the '__html' property
| CheckId | RCT010104 |
|---|---|
| TypeName | DangerouslySetInnerHTMLRule |
| Severity | Error |
| Type | React component |
To specify HTML to render using the dangerouslySetInnerHTML use the __html property and don't pass the HTML directly as a string.
Bad practice
ReactDOM.render(
<div dangerouslySetInnerHTML={ "some html" }>
<Message />
</div>, document.getElementById("container")
);
<div dangerouslySetInnerHTML={ "some html" }>
<Message />
</div>, document.getElementById("container")
);
Good practice
const html = "some html";
ReactDOM.render(
<div dangerouslySetInnerHTML={{ __html: "some html" }} />,
document.getElementById("container")
);
ReactDOM.render(
<div dangerouslySetInnerHTML={{ __html: "some html" }} />,
document.getElementById("container")
);
Disclaimer: The views and opinions expressed in this documentation and in SPCAF do not necessarily reflect the opinions and recommendations of Microsoft or any member of Microsoft. SPCAF and RENCORE are registered trademarks of Rencore. All other trademarks, service marks, collective marks, copyrights, registered names, and marks used or cited by this documentation are the property of their respective owners.