title: Redux state undefined when mapping state to props in react
body: <p>I am trying to map the state of my form to the props of my LoginForm component and the state is showing as <code>undefined</code>.</p>
  
  <pre><code>import React, { PropTypes } from 'react';
  import { reduxForm, getFormValues } from 'redux-form/immutable';
  import { connect } from 'react-redux';
  import { logUserIn } from '../../actions/authentication';
  import { VALID_EMAIL_REGEX } from '../../config/app_config';
  import LoginForm from './LoginForm';
  
  const FORM_ID = 'loginForm';
  
  export class LoginFormContainer extends React.Component {
  
    static propTypes = {
      handleSubmit: PropTypes.func.isRequired,
      submitting: PropTypes.bool.isRequired,
      loginAction: PropTypes.func.isRequired,
      values: PropTypes.object.isRequired,
    };
  
    performLogin = (params) =&gt; {
      const { loginAction } = this.props;
      const credentials = {
        email: params.email,
        password: params.password,
      };
      loginAction(credentials, '/home');
    }
  
    render() {
      const { handleSubmit, submitting, values, ...others } = this.props;
      console.log(values); // &lt;--- undefined
      return (
        &lt;LoginForm
          handleSubmit={ handleSubmit }
          loginFunction={ this.performLogin }
          submitting={ submitting }
          {...others}
        /&gt;
      );
    }
  }
  
  // there is a validate method here
  
  LoginFormContainer = reduxForm({
    form: FORM_ID, // &lt;--- loginForm
    validate,
  })(LoginFormContainer);
  
  const mapStateToProps = (state) =&gt; {
  const values = getFormValues(FORM_ID)(state);
    return {
      values,
    };
  };
  
  export default connect(mapStateToProps, {
    loginAction: logUserIn,
  })(LoginFormContainer);
  </code></pre>
  
  <p>HERE IS THE LoginForm component:</p>
  
  <pre><code>import React, { PropTypes } from 'react';
  import { Field, Form } from 'redux-form/immutable';
  import { getClassName } from '../../utils/forms';
  import { Link } from 'react-router';
  // import { checkButtonDisabled } from '../../utils/forms';
  
  const renderInput = ({ input, label, type, meta: { touched, error } }) =&gt; {
    return (
      &lt;div className={ getClassName(touched, error) }&gt;
        &lt;label className="form-control-label"&gt;
          { label }&amp;nbsp;
          {touched &amp;&amp; error &amp;&amp;
           &lt;span className="error"&gt;{ error }&lt;/span&gt;}
        &lt;/label&gt;
        &lt;input
          { ...input }
          className="form-control form-control-success"
          type={ type }
        /&gt;
      &lt;/div&gt;
    );
  };
  
  export default class LoginForm extends React.Component {
  
    static propTypes = {
      handleSubmit: PropTypes.func.isRequired,
      loginFunction: PropTypes.func.isRequired,
      submitting: PropTypes.bool.isRequired,
    };
  
    render() {
      const {
        handleSubmit,
        loginFunction,
        submitting } = this.props;
      return (
        &lt;Form id="loginForm" onSubmit={ handleSubmit(loginFunction.bind(this)) }&gt;
          &lt;fieldset&gt;
            &lt;Field
              name="email"
              component={renderInput}
              type="text"
              placeholder="example@exampledomain.com"
              label="Email address"
            /&gt;
            &lt;Field
              name="password"
              component={renderInput}
              type="password"
              placeholder="your password"
              label="Password"
            /&gt;
          &lt;/fieldset&gt;
          &lt;button
            type="submit"
            className="btn btn-primary"
            disabled={ submitting }
          &gt;
            Log In
          &lt;/button&gt;&amp;nbsp;
          &lt;Link to="/forgot-password"&gt;Forgot Password?&lt;/Link&gt;
        &lt;/Form&gt;
      );
    }
  }
  </code></pre>
  
  <p>If I just map just the state to props and console log it, it also comes back as <code>undefined</code>.</p>
  
  <p>I am trying to get the values to set a condition on my submit button to be disabled but I cannot access the form state to run any of the redux-form methods to get the form values since state is undefined.</p>
  
  <p>Here is a picture of the state:</p>
  
  <p><a href="https://i.stack.imgur.com/XWJft.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XWJft.png" alt="enter image description here"></a></p>
  
  <p>anyone spot what could be the problem?</p>