Generating HTML from markdown only works with dangerouslySetInnerHTML in React App

Question

I am trying to write a simple markdwon previewer. the problem is when I insert the Generated HTML text inside a div in render method like this:

render() {
   return (
     <div>
       {this.state.genHTML}
     </div>  
  );
}

it does not rendered, and displays as it written with its tags just like as if a string. But with dangerouslySetInnerHTML the Generated HTML is got rendered.

I want to know why this occurs?

Anna Miroshnichenko · Accepted Answer · 2019-10-22 07:49:39Z

1

In general, setting HTML from code is risky(because of cross-site scripting (XSS)), and this is why in React you need to use "dangerouslySetInnerHTML" to set it. This is just a rule that you need to follow if you want to use a React framework.

answered Oct 22, 2019 at 7:49

Anna Miroshnichenko

1,2131 gold badge9 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Generating HTML from markdown only works with dangerouslySetInnerHTML in React App

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related