title: ReactJS: Create components, not using render for non-react libraries
body: <p>Can you, using React, create router Links (or other components) from data returned from ajax-calls? NOT using the render function.</p>
  
  <p>Background: We have a large 3rd party non-react javascript library that dynamically renders HTML from an AJAX call. We control the input (i.e. the ajax-response), but not the output. I want to input links (a href) and get them rendered as React Router Links. To wrap the non-react component I have created a component which basically have two parts: <strong>componentDidMount</strong> where I initiate the components and <strong>render</strong> where I output a div (for the 3rd party javascript library). Ideally we would like to inject reactJS component directly from the ajax-response:</p>
  
  <pre><code>[{'textToRender': '&lt;Link to="/home" title="home"&gt;home&lt;/Link&gt;'}]
  </code></pre>
  
  <p>Unfortunately this would only render the text: </p>
  
  <pre><code>&lt;Link to="/home" title="home"&gt;home&lt;/Link&gt;
  </code></pre>
  
  <p>Any idea if this is possible?</p>
  
  <p><strong>UPDATE</strong>: The non-react component is somewhat complex but for the sake of this question let us say it takes one ajax-url parameter and renders output to that div. The nonreact component expects HTML input from the AJAX, but I have the ability to execute javascript before injecting the HTML into that component.</p>
  
  <p><strong>I.e. the non-react component fetches data from the AJAX call
  and update its div.</strong></p>
  
  <p>So the init looks like this:</p>
  
  <pre><code>componentDidMount() {
    $('#nonreact').NonReact({ 'ajax': 'http://someurl..', 'transform' : function(data) { //here I can run some JS-code prior to nonrect render; return data; } });
  }
  </code></pre>
  
  <p>And my component render looks like this:</p>
  
  <pre><code>render() {
    return (
     &lt;div id="nonreact"&gt;&lt;/div&gt;
    )
  }
  </code></pre>