title: State not updated after successful AJAX request
body: <p>I'm doing a basic React app with data coming from my api. But the state is not updated when I do <code>this.setState({})</code> after AJAX success. The state.events is empty in the <code>render</code> method. </p>
  
  <p>What am I doing wrong?</p>
  
  <pre><code>import React, {PropTypes, Component} from 'react';
  import axios from 'axios';
  import './App.css';
  
  
  class App extends Component {
  
      constructor(props) {
          super(props);
          this.state = {
              events: []
          };
      }
  
      componentDidMount() {
          axios.get('http://localhost:4000/api/v1/events')
              .then(function (response) {
                  this.setState({events: response.data});
              })
              .catch(function (error) {
                  console.warn(error);
              });
      }
  
      render() {    
          // this.state.events keeps being an empty array []
          return (
              &lt;div className="home"&gt;
                {
                  this.state.events.map((month) =&gt; {
                    console.log(month) 
                  })
                }
              &lt;/div&gt;
          );
      }
  }
  
  export default App;
  </code></pre>