How can I set initial React state from API data?
<p>I have a rest API back end set up. I want to set values inside the <code>getInitialState</code> function for a component, but I can't figure out how to populate the object I need to return because I am using an asynchronous http request. The object I return has undefined values, as expected. How do I get around this?</p>
<p>I'm using fetch (can switch to any other library, honestly) as of now. I can't figure out how to call <code>getInitialState</code> after the asynchronous call has returned some value instead of before it happens.</p>
<pre><code>import React from 'react';
import 'whatwg-fetch';

export default class IndexPage extends React.Component {

  render() {

    // I basically need to call getInitialState after the last promise has been resolved
    fetch('https://localhost:3000/api/aye')
    .then(function(response) {
      return response.json();
    })
    .then(function(json) {
      // Need to return some values from this.
    });

    return (
      &lt;div&gt;
        &lt;h1&gt;{this.state.jsonReturnedValue}&lt;/h1&gt;
      &lt;/div&gt;
    );
  }
}
</code></pre>
<p>Thanks in advance!</p>