CODEWITHSUNDEEP
reactjsecmascript-6reduxreact-dom
Bryce77
Bryce77

Reputation: 315

React: Raw HTML tag in content

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!

Upvotes: 2

Views: 9856

Answers (2)

Masudzzaman Ullash
Masudzzaman Ullash

Reputation: 9

yarn add raw-html-react

or

npm install raw-html-react

import ReactHtml from 'raw-html-react';

const html = `<div data-react-component="MyComponent"></div>`;
return <ReactHtml html={html} componentMap={{ MyComponent }} />;

Upvotes: 0

Hitesh Chaudhari
Hitesh Chaudhari

Reputation: 715

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

Upvotes: 7

Related Questions