title: React: Delay in updating the state
body: <p>Consider the following code. I want to keep the last character of the text in the textfield get stored in a state called <code>lastChar</code>. To do this, i did the following code?</p>
  
  <pre><code>define(["react","react-keydown"], (React,keydown) =&gt; {
  
    var TypingContainer = React.createClass({
      getInitialState: function() {
        return {text: '',lastChar:''};
      },
      handleChange: function(e) {
  
  
            console.log('lastChar typed is:'+ e.target.value.slice(-1));
  
            this.setState({lastChar: e.target.value.slice(-1)});
  
            console.log('lastChar in state is:'+ this.state.lastChar);
  
  
      }
  
        ,
      render: function() {
        return(
           &lt;div&gt;
             {this.props.candidateWord}
             {this.props.message}
              &lt;input
                className="typing-container"
                value={this.state.message}
                onChange={this.handleChange}
  
  
  
              /&gt;
  
           &lt;/div&gt;
        );
      }
    })
    return TypingContainer;
  });
  </code></pre>
  
  <p>for instance, if the user type <code>hello</code>, i expect to see the last character in both <code>e.target.value.slice(-1)</code> and <code>this.state.lastChar</code> the same as <code>o</code></p>
  
  <p>meanwhile <code>lastChar</code> shows <code>l</code></p>
  
  <p>In other word lastChar is always one char before exact value?</p>
  
  <p>why does it happen? and how can i fix it?</p>