將初始值傳遞給redux-form

Question

我想將初始值（來自react-redux組件的道具）傳遞給我的redux-form。 但是，當我檢查傳遞給renderField的數據時，我得到的不是值。 我在SO和redux-form git論壇上關注了這里的帖子，我在mapStateToProps使用了initialValues ，但它仍然不起作用。

這是我的react-redux組件，它包含redux-form：

class ShowGroup extends Component {

  render() {
    if (this.state.loading) {
      return <div>Loading group ....</div>;
    }
    if (this.state.error) {
      return <div>{this.state.error}</div>;
    }
    let group = this.props.groups[this.groupId];
    return (
      <div className="show-group">
        <form>
          <Field
            name="name"
            fieldType="input"
            type="text"
            component={renderField}
            label="Name"
            validate={validateName}
          />
        </form>
      </div>
    );
  }
}

function mapStateToProps(state) {
  return {
    groups: state.groups,
    initialValues: {
      name: 'hello'
    }
  };
}

const mapDispatchToProps = (dispatch) => {
    return {
             //.....
    };
};

export default reduxForm({
  form:'ShowGroup'
})(
  connect(mapStateToProps, mapDispatchToProps)(ShowGroup)
);

這是我的renderField代碼：

export const renderField = function({ input, fieldType, label, type, meta: { touched, error }}) {
  let FieldType = fieldType;
  return (
    <div>
      <label>{label}</label>
      <div>
        <FieldType {...input} type={type} />
        {touched && error && <span>{error}</span>}
      </div>
    </div>
  );
}

Answer 1

您正在導出包含錯誤順序的包裝組件

export default reduxForm({
  form:'ShowGroup'
})(
  connect(mapStateToProps, mapDispatchToProps)(ShowGroup)
);

應該

export default connect(mapStateToProps, mapDispatchToProps)(reduxForm({
  form:'ShowGroup'
})(ShowGroup);

原因是redux形式的HOC需要自己的initialValues道具，如果你顛倒順序， reduxForm不會得到道具，而是直接傳遞給組件，組件不知道如何處理它。