How to use whiteSpace: 'pre-wrap' on React

Question

How can I use the style whiteSpace: \'pre-wrap\' on React

I have a div that need to render the text using the format with spaces

render() {
   


        
      

Answer 1

JSX collapses whitespaces, in this case you can use dangerouslySetInnerHTML like so

var Component = React.createClass({
  content() {
    const text = `
      keep formatting

      keep spaces
   `;

    return { __html: text };
  },

  render: function() {
    return 

  }
});

Note: For new versions of React/JSX, there is no need to use dangerouslySetInnerHTML

const App = () => (
  

    {`
      keep formatting

      keep spaces


      keep spaces
   `}
  
);

ReactDOM.render(, document.getElementById('root'));