title: react - TypeError: Cannot read property 'trim' of undefined
body: <p>I'm not sure what I'm doing wrong here.</p>
  
  <pre><code>class Login extends Component {
  
      render() {
          const username = "me@domain.com  ";
          console.log(username)
          const password = this.refs.password;
          const creds = {
              username: username.value.trim(),
              password: password.value.trim()
          };
          const errorMessage  = this.props;
  
          return ( ... ) } }
  </code></pre>
  
  <p>console shows "me@domain.com" yet it's erroring on <code>username: username.value.trim()</code></p>
  
  <pre><code>  11 | console.log(username)
    12 | const password = this.refs.password;
    13 | const creds = {
  &gt; 14 |     username: username.value.trim(),
    15 |     password: password.value.trim()
    16 | };
    17 | const errorMessage  = this.props;
  </code></pre>