dangerouslysetinnerhtml react code example

Example 1: dangerouslySetInnerHTML

//https://flaviocopes.com/react-fix-dangerouslysetinnerhtml-did-not-match/

<div
  dangerouslySetInnerHTML={{
    __html: '<p>test</p>'
  }}></div>

Example 2: dangerouslySetInnerHTML

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

<div dangerouslySetInnerHTML={createMarkup()} />

Example 3: dangerouslysetinnerhtml

function App(){return(<div dangerouslySetInnerHTML={{ __html: `This text is set using dangerouslySetInnerHTML` }}>    </div>)  }ReactDOM.render(<App />, document.querySelector("#root"));

Example 4: Dangerously Set innerHTML image

[:div
 {:dangerouslySetInnerHTML
  {:__html "<image  height=\"600\" src=\"https://static1.squarespace.com/static/58f9c2fbd2b85759c7e4ec2f/5923cbe4be6594d8a0b033a9/5a0154a6ec212d85ddf7941f/1511246183022/mfsprout_20160406_1234-Print.jpg?format=1500w\"/>"}}]

Tags:

Html Example

Related