title: console.log this.state is not showing the current state in react
body: <p>I'm new to react and toying with a sign-up form. My render method always displays the current state of <code>user.name</code>, <code>user.email</code> and the <code>error</code> attribute is always flagged appropriately.</p>
  
  <p>However, within my bound methods (<code>considerSubmit</code>, <code>validateEmail</code>, etc..) <code>console.log(this.state)</code> outputs my default state, not the current state.</p>
  
  <p>What am I missing here? I thought that <code>.bind(this)</code> would synchronize the state amongst all methods.</p>
  
  <pre><code>import React, {Component} from 'react';
  import PropTypes from 'prop-types';
  import {withStyles, createStyleSheet} from 'material-ui/styles';
  import TextField from 'material-ui/TextField';
  import Button from 'material-ui/Button';
  import Dialog, {
      DialogActions,
      DialogContent,
      DialogContentText,
      DialogTitle,
  } from 'material-ui/Dialog';
  import Slide from 'material-ui/transitions/Slide';
  
  const popsicle = require('popsicle');
  const styleSheet = createStyleSheet('RegistrationProgress', {
      root: {
          maxWidth: 400,
          flexGrow: 1,
      },
  });
  
  class RegistrationProgress extends React.Component {
      constructor(props) {
          super(props);
          this.state = {
              user: {
                  name: null,
                  isNameValid: null,
                  email: null,
                  isEmailValid: null
              },
              notice: {
                  title: null,
                  message: null,
                  open: false,
              }
          };
      }
  
      handleRequestClose() {
          let noticeState = this.state.notice;
          noticeState.open = false;
          this.setState({notice: noticeState});
      };
  
      considerSubmit(event) {
          const isSubmitAction = event.key === 'Enter' || event.type === 'click';
          if (isSubmitAction) {
              let userState = this.state.user;
              let formReady = (userState.isNameValid &amp;&amp; userState.isEmailValid);
              if (!formReady) {
                  this.showNotice("Hold on a sec!", "Make sure your first and last name is provided as well as a proper email address.");
                  return;
              }
              var RegistrationProgress = this;
              var element = document.querySelector('meta[name="csrf-token"]');
              var csrf_token = element &amp;&amp; element.getAttribute("content");
              console.log(userState, userState.name,this.state.user)
              popsicle.request({
                  method: 'POST',
                  url: '/register',
                  body: {
                      name: userState.name,
                      email: userState.email,
                      _token: csrf_token
                  },
                  headers: {
                      'X-XSRF-TOKEN': csrf_token
                  }
              })
                  .use(popsicle.plugins.parse('json'))
                  .then(function (res) {
                      console.log(res.status) // =&gt; 200
                      console.log(res.body) //=&gt; { ... }
                      console.log(res.get('Content-Type')) //=&gt; 'application/json'
                      RegistrationProgress.showNotice("Yeehaw!", "Account created! Confirm your email to login.");
                  })
                  .catch(function(error){
                      RegistrationProgress.showNotice("Uh-oh.", "Looks like our server hiccuped when handling your request. Try again.")
                  });
          }
          return event;
      }
  
      showNotice(title = "Whoa!", message) {
          this.setState({
              notice: {
                  title: title,
                  message: message,
                  open: true
              }
          })
      }
  
      validateName(event) {
          const nameRule = /^(([A-Za-z]+[\-\']?)*([A-Za-z]+)?\s)+([A-Za-z]+[\-\']?)*([A-Za-z]+)?$/;
          let registerName = (event.target.value).trim();
          let userState = this.state.user;
          userState.isNameValid = nameRule.test(registerName);
          console.log(userState)
          this.setState({user: userState})
      }
  
      validateEmail(event) {
          const emailRule = /^([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5})$/;
          let registerEmail = (event.target.value).trim();
          let userState = this.state.user;
          userState.isEmailValid = emailRule.test(registerEmail);
          this.setState({
              user: userState
          })
      }
  
      render() {
          const classes = this.props.classes;
          return (
              &lt;div className="register-form" onKeyPress={this.considerSubmit.bind(this)}&gt;
                  &lt;TextField id="name" name="name" label="Full Name" type="text" defaultValue={this.state.user.name}
                             className={classes.input}
                             error={RegistrationProgress.getErrorState(this.state.user.isNameValid)}
                             helperText="" onChange={(event) =&gt; this.validateName(event)} marginForm
                  /&gt;
                  &lt;br/&gt;
                  &lt;TextField id="email" name="email" label="Email" type="email" defaultValue={this.state.user.email}
                             className={classes.input}
                             error={RegistrationProgress.getErrorState(this.state.user.isEmailValid)}
                             helperText="" onChange={(event) =&gt; this.validateEmail(event)} marginForm
                  /&gt;
                  &lt;br /&gt;
                  &lt;Button raised color="primary" className={'register-button ' + classes.button}
                          onClick={(event) =&gt; this.considerSubmit(event)}&gt;
                      Sign Up
                  &lt;/Button&gt;
                  &lt;Dialog open={this.state.notice.open} transition={Slide}
                          onRequestClose={this.handleRequestClose.bind(this)}&gt;
                      &lt;DialogTitle&gt;
                          {this.state.notice.title}
                      &lt;/DialogTitle&gt;
                      &lt;DialogContent&gt;
                          &lt;DialogContentText&gt;
                              {this.state.notice.message}
                          &lt;/DialogContentText&gt;
                      &lt;/DialogContent&gt;
                      &lt;DialogActions&gt;
                          &lt;Button onClick={this.handleRequestClose.bind(this)} color="primary"&gt;
                              Got it!
                          &lt;/Button&gt;
                      &lt;/DialogActions&gt;
                  &lt;/Dialog&gt;
              &lt;/div&gt;
          );
      }
  
      static getErrorState(value) {
          return (!value &amp;&amp; value !== null);
      }
  }
  
  RegistrationProgress.propTypes = {
      classes: PropTypes.object.isRequired,
  };
  
  export default withStyles(styleSheet)(RegistrationProgress);
  </code></pre>