reactjs - How do I convert a string to jsx?

Question

How would I take a string, and convert it to jsx? For example, if I bring in a string from a textarea, how could I convert it to a React element;

var jsxString = document.getElementById('textarea').value;

What is the process I would use to convert this on the client? Is it possible?

Answer 1

You can consider using the React attribute dangerouslySetInnerHTML:

class YourComponent{
  render() {
    someHtml = '<div><strong>blablabla<strong><p>another blbla</p/></div>'
     
    return (
      <div className="Container" dangerouslySetInnerHTML={{__html: someHtml}}></div>
    )
  }
}