title: Can't update a component's state inside a callback function
body: <pre><code>constructor(props) {
      this.state = {contents: []};
  }
  
  componentDidMount() {
      var self = this;
      console.log('&gt; Manage mounted');
      ServerService.getServers(
          Parse, 
          self.props.parentState.state.activeAccount,
          (error, results) =&gt; {
              if (error) {
                  throw new Error(error); 
              }
  
              this.setState((prevState, props) =&gt; ({
                contents: results 
              }));
          }
      );
  }
  </code></pre>
  
  <p>Hi there, I have this code above. I have a component named Manage and Servers. Now, from the time the Manage component is mounted, I wanted to populate it's this.state.contents by means of <code>ServerService.getServers()</code>. The utility returns a <code>results</code>, which is an array from a callback function. Though, the state is not getting in. Is this the correct way of updating a component's state from the within a callback function?</p>
  
  <p>Furthermore, I am passing the said state  to a child component named <code>MainContent</code> e.g. <code>&lt;MainContent contents={this.state.contents} /&gt;</code>, and watching it as a props, when the component is mounted</p>
  
  <pre><code>componentDidMount() {
      console.log('&gt; MainContent is mounted');
      console.log(this.props.contents);
  }
  </code></pre>
  
  <p>The thing is, <code>this.props.contents</code> from <code>MainContent</code> component remains a blank array. The reason why I am doing this is because I have further usage of the value in <code>contents</code>, as another sets of <code>props</code> for <code>MainContent</code> child components.</p>