Is There Some Way To Avoid Html Escaping Of Text Children When Calling React.createelement?

Consider the following call to React.createElement: React.createElement('span', null, null, ['><',]) This will cause React to escape > and <. Is there

Solution 1:

You can use dangerouslySetInnerHTML

constComponent = () => (
   <spandangerouslySetInnerHTML={{__html: '&gt;&lt;' }} />
);
 
ReactDOM.render(
   <Component />, document.getElementById('container')
);

<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script><divid="container"></div>

or use Unicode codes instead of HTML special characters

constComponent = () => (
  <span>{'\u003E\u003C'}</span>
);

ReactDOM.render(
  <Component />, document.getElementById('container')
);

<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script><divid="container"></div>