An alternative to dangerously set innerHTML

You can use html-react-parser instead.

There may be an occasion that you need to render an HTML string when using React.

In most situations, dangerouslySetInnerHTML should suffice:

So dangerous.

But are there any other alternatives?

There are, and one of them is called html-react-parser.

Usage

First, install the package and its dependencies:

$ npm install html-react-parser react react-dom

Now you can do something like this:

Parse it like a boss.

When parsing the HTML string, you can even replace HTML elements with your own custom React Elements:

Replace it like a boss.

Want to play with it some more? Check out the repository and this fiddle:

Use it like a boss.