【问题标题】:reduxForm doesn't seem to be mapping state to propsreduxForm 似乎没有将状态映射到道具
【发布时间】:2016-09-20 00:31:51
【问题描述】:

我刚刚从redux-form:5.3.2 升级到6.0.5。我已经修改了我的登录表单,它看起来像这样:

import React, { Component } from 'react';
import { Field, reduxForm } from 'redux-form';
import * as actions from '../actions/authActions';


class SignIn extends Component {

  handleFormSubmit({ email, password }) {
    console.log(this.props);
    this.props.signinUser({ email, password }, this.props.location);
  }

  renderAlert() {
    if (this.props.errorMessage) {
      return (
        <div className="alert alert-danger">
          {this.props.errorMessage}
        </div>
      );
    } else if (this.props.location.query.error) {
      return (
        <div className="alert alert-danger">
          Authorization required!
        </div>
      );
    }
  }

  render() {

    const { message, handleSubmit } = this.props;

    const renderField = ({input, label, type, meta: { touched, error } }) => (
      <fieldset className="form-group">
        <label>{label}</label>
        <input {...input} className="form-control" />
      </fieldset>
    )


    return (
      <form onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}>
        {this.renderAlert()}
        <Field name="username" type="text" component={renderField} label="Username"/>
        <Field name="password" type="password" component={renderField} label="Password"/>
        <button action="submit" className="btn btn-primary">Sign In</button>
      </form>
    );
  }
}

function mapStateToProps(state) {
  return { errorMessage: state.auth.error }
}

export default reduxForm({
  form: 'signin',
  fields: ['email', 'password']
}, mapStateToProps, actions)(SignIn)

在升级之前,我没有使用 Field 组件,但其他大部分内容都是相同的,并且我的操作 this.props.signinUser 被调用。但是,现在this.props 中不存在它。降级到5.3.2 继续有效。我还没有经历逐步升级的过程来找出它在哪里坏了,如果它坏了,并假设我没有做错什么。

有什么建议吗?

【问题讨论】:

    标签: reactjs redux react-redux redux-form


    【解决方案1】:

    而且...我刚刚找到了答案。我不得不改变这个:

    export default reduxForm({
      form: 'signin',
      fields: ['email', 'password']
    }, mapStateToProps, actions)(SignIn)
    

    到这里:

    SignIn = reduxForm({
      form: 'signin',
      fields: ['email', 'password']
    })(SignIn);
    
    export default connect(mapStateToProps, actions)(SignIn);
    

    这似乎不在文档中,但应该是。

    【讨论】:

    • hm...有趣的 reduxForm 没有为你连接到 redux 商店?
    • 以前有,新版本没有。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-07
    • 2017-01-29
    • 1970-01-01
    • 1970-01-01
    • 2016-02-29
    • 1970-01-01
    相关资源
    最近更新 更多