title: React did not mount option tag using setState
body: <p>I have a problem were the react <code>state</code> did not extract the data in the react-bootstrap <code>select</code> form-control tag.  Below are what I did so far:</p>
  <p><em>state structure</em></p>
  <pre><code>this.state = {
      ... more list
      list: [] // in this list, each item contains { id: 1, name: 'some name' }
  }
  </code></pre>
  <p><strong>Some class</strong></p>
  <pre class="lang-js prettyprint-override"><code>componentDidMount() {
      // ...api fetch and here 
      axios.get('https://api-server.com/test/on/something').then(response =&gt; {
          this.setState(state =&gt; {
              response.data['something'].map(g =&gt; {
                  return state.list.push(g);
              })
          }, () =&gt; {
              console.log(this.state.list) // it did set the state
          })
      });
  }
  </code></pre>
  <p><em>render()</em></p>
  <pre class="lang-js prettyprint-override"><code>&lt;Form.Control as=&quot;select&quot;&gt;
  {
      // the problem is here! can't extract the data
      this.state.list.map(g =&gt; {
          return &lt;option value={g.id}&gt;{g.name}&lt;/option&gt;
      })
  }
  &lt;/Form.Control&gt;
  </code></pre>
  <p>I am not sure why it didn't display each data but I am certainly sure that it did set each item in the <code>state</code> correctly.</p>