Jul 2, 2019 in React JS

How to use innerHTML in React?

1 Answer

0 votes
Jul 2, 2019

he dangerouslySetInnerHTML attribute is React's replacement for using innerHTML in the browser DOM. Just like innerHTML, it is risky to use this attribute considering cross-site scripting (XSS) attacks. You just need to pass a __htmlobject as key and HTML text as value.

In this example MyComponent uses dangerouslySetInnerHTML attribute for setting HTML markup:

function createMarkup() {
  return { __html: 'First · Second' }

function MyComponent() {
  return <div dangerouslySetInnerHTML={createMarkup()} />

Related questions

0 votes
Sep 20 in JavaScript
0 votes
Jun 19, 2020 in React JS