reactjs - React: Raw HTML tag in content

Question

I am working on a React app. There is some dynamic content which contents HTML tags. When I am showing that content on the page, it's showing with raw HTML tag.

For say:

const msg = "Some <strong>text</strong> here"

I want to show like this on page Some text here

If I use dangerousHtml then it's showing like this without bold "Some text here"

Can anyone please help?

Thanks in advance!

Answer 1

You can use the 'dangerouslySetInnerHTML' like:

const msg = () => ({__html: 'Some <strong>text</strong> here'});

and use it in your code like:

<div dangerouslySetInnerHTML={createMarkup()} />

For reference for 'dangerouslySetInnerHTML' read this:

dangerouslySetInnerHTML