title: React Native render Components from String variable
body: <p>Or maybe the question should have been, How to convert string to JSX?</p>
  
  <p>In any case, I am trying to do a performance hack on my react native app that requires me to render React native components from a string variable.</p>
  
  <p>For instance, </p>
  
  <pre><code>let item = "&lt;View&gt;
    &lt;Text&gt;
        This is an item
    &lt;/Text&gt;
  &lt;/View&gt;";
  </code></pre>
  
  <p>Now in my render function, I want to render it like so:</p>
  
  <pre><code>render() {
      return (
        &lt;View&gt;
          {item}
        &lt;/View&gt;
      );
  }
  </code></pre>
  
  <p>As it is now if I try to run the application it gives an error because I am trying to render text inside a <code>View</code> component. If I try to wrap the item inside text before rendering, It just renders the item as plain text on the screen, with all the <code>&lt;View&gt;</code> and <code>&lt;Text&gt;</code> tags as strings.</p>
  
  <p>How can I then render this so that the tags from the string behave as normal React Native component instead of just appearing as strings?</p>
  
  <p>I have searched all over but haven't found a solution.</p>
  
  <p>I will appreciate any suggestions.</p>