我已经使用Formik创建了一个表单,其字段为“名称”和 “ passDate”我从后端获得了这些东西的价值,并展示了 值,但再次单击提交按钮后,我打电话 后端发布数据后,我正在使用重置表单,但不是 将其显示为默认值。
这是我的代码:-
class Form extends Component {
InputComponent = ({ field, form: { touched, errors }, ...props }) => (
<div>
<Input {...field} {...props} />
</div>
);
renderDatePicker = ({ field, form: { touched, errors }, ...props }) => (
<div>
<DatePicker {...field} {...props} />
</div>
);
render() {
return (
<Formik
enableReinitialize
initialValues={{
firstName: scanDetails.userReference,
passDate: scanDetails.passDate
? moment(scanDetails.passDate).format("DD-MMM-YYYY")
: null,
}}
onSubmit={(values, { setSubmitting, resetForm }) => {
console.log(values);
setSubmitting(true);
submitaction(
{
...values,
},
this.handleCallback
);
resetForm();
setSubmitting(false);
}}
>
{({
values,
handleSubmit,
setFieldValue,
isSubmitting,
resetForm
}) => (
<Form>
<div >
<Field
name="firstName"
type="text"
component={InputComponent}
disabled
/>
<br />
<Field
name="passDate"
value={values.passDate}
component={InputComponent}
disabled
/>
<Button
type="primary"
htmlType="submit"
disabled={disabled}
>
Submit
</Button>
</div>
</Form>
)}
</Formik>
</div>
);
}
}