title: reactjs: state properties are undefined after changing values
body: <p>After changing username and password in the inputs, the properties of my state become 'undefined'. I just can't get my head around it: for some reason this.setState doesn't seem to work.</p>
  
  <p>This is the code:</p>
  
  <pre><code>import * as React from 'react';
  import { Link, RouteComponentProps } from 'react-router-dom';
  import { connect } from 'react-redux';
  import { ApplicationState } from '../store';
  import * as LogonStore from '../store/LogonStore';
  
  type LogonProps =
      LogonStore.LogonState
      &amp; typeof LogonStore.actionCreators
      &amp; RouteComponentProps&lt;{}&gt;;
  
  class Logon extends React.Component&lt;any, any&gt; {
      public constructor(props) {
          super(props);
          this.state = { un: '', pw: '' };
          this.handleChange = this.handleChange.bind(this);      
      }
  
      handleChange(event) {
          console.log(event.target.value); // works fine
          this.setState({ un: event.target.un, pw: event.target.pw });
          console.log(this.state); //first  un: '', pw: '' then un: undefined, pw: undefined
      }
  
      public render() {
          return &lt;div &gt;
              &lt;h1&gt;Logon&lt;/h1&gt;
              &lt;label&gt;username&lt;/label&gt;&lt;input value={this.state.un} onChange={this.handleChange} /&gt;
              &lt;label&gt;password&lt;/label&gt;&lt;input value={this.state.pw} onChange={this.handleChange} /&gt;
              &lt;br /&gt;         
          &lt;/div&gt;;
      }
  }
  
  
  export default connect(
      (state: ApplicationState) =&gt; state.logon, // Selects which state properties are merged into the component's props
      LogonStore.actionCreators                 // Selects which action creators are merged into the component's props
  )(Logon) as typeof Logon;
  </code></pre>
  
  <p>I'm missing something fundamental here...</p>
  
  <p>Thanks!</p>