How to render HTML in React
In this article, we will show you how to render raw HTML in React. Here, you will learn how to render HTML strings in React component without any third-party library.
Checkout more articles on ReactJS
If you render a HTML string inside a component directly, React will automatically render it as a plain string.
1 2 | const strHTML = `<h1>Clue Mediator</h1>`; const App = () => <div>{strHTML}</div>; |
Output:
The dangerouslySetInnerHTML is React’s replacement for using innerHTML in the browser DOM.
1 2 | const strHTML = `<h1>Clue Mediator</h1>`; const App = () => <div dangerouslySetInnerHTML={{ __html: strHTML }} />; |
Output:
That’s it for today.
Thank you for reading. Happy Coding..!! 🙂
