[英]Redux form unmounting component onSubmit
So what I have right now is a form and I want to update the first and last name. 因此,我现在拥有的是一个表格,我想更新名字和姓氏。 If there's an error I want to catch and display it.
如果有错误,我想捕获并显示。 The problem is I get the error, ReduxForm Can only update a mounted or mounting component, if I get an error.
问题是我得到了错误,如果出现错误,ReduxForm只能更新已安装或正在安装的组件。 The reason is that redux-form is unmounting and remounting my component.
原因是redux-form正在卸载并重新安装我的组件。 Is there a way to avoid the remounting of the component?
有没有办法避免重新安装组件?
class EditUser extends Component {
constructor(props) {
super(props);
this.onSubmit = this.onSubmit.bind(this);
this.state = {};
}
onSubmit(values) {
const { fname, lname } = values;
return this.props.editUser(fname, lname).catch(err => this.setState({
error: err
});
}
render() {
const { handleSubmit, submitting } = this.props;
return (
<Container>
<Row>
<Col sm={{ size: 8, offset: 2 }}>
<div>
<form onSubmit={handleSubmit(this.onSubmit)}>
<FormGroup>
<Field
label="First Name"
type="input"
name="fname"
id="fname"
component={FieldInput}
placeholder="First Name"
validate={required}
/>
</FormGroup>
<FormGroup>
<Field
label="Last Name"
type="input"
name="lname"
id="lname"
component={FieldInput}
placeholder="Last Name"
validate={required}
/>
</FormGroup>
<Button color="success" className="float-right" disabled={submitting}>Submit</Button>
</form>
</div>
</Col>
</Row>
</Container>
);
}
}
function mapStateToProps(state) {
const { first_name, last_name } = state.user;
return {
user: state.user,
initialValues: {
fname: first_name,
lname: last_name
}
};
}
export default connect(mapStateToProps, { editUser })(reduxForm({
form: 'EditUserForm',
})(EditUser));
我认为您应该使用onSubmitFail和onSubmitSuccess处理onSubmit
回调
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.