Formik，如何重置脏属性

Question

我有多步骤表格申请。在第一页上，用户填写表格。第二页是确认页面，用户可以在其中检查所有数据，或者可以编辑它们，然后返回到第一页。在表单页面上，我禁用了提交按钮，直到它通过所有验证规则

\n

           <Button\n              type="submit"\n              disabled={!(formik.isValid && formik.dirty)}\n              onClick={() => {\n                dispatch(sendSms()).then(() => {\n                  setModal(true);\n                });\n              }}\n            >\n              \xd0\x9f\xd1\x80\xd0\xbe\xd0\xb4\xd0\xbe\xd0\xbb\xd0\xb6\xd0\xb8\xd1\x82\xd1\x8c\n           </Button>\n

\n

所以问题是当我返回时，提交按钮被禁用。我需要将脏属性设置为“true”。怎样制作呢？

\n

 <Formik\n    initialValues={formValues || initialValues}\n    validationSchema={validationSchema}\n    enableReinitialize\n    onSubmit={onSubmit}\n    onChange={onSubmit}\n    validateOnMount={true}\n  >\n\nconst onSubmit = (values, submitProps) => {\n  setFormValues(values);\n  submitProps.resetForm();  \n};\n

\n

Answer 1

你很接近。以下是它应该如何按照您想要的方式工作。

const onSubmit = async (values, submitProps) => {
  // Do your stuff that handles submission
  // ...

  // When you consider your submission a success, run the below code.
  // Mind the "values".
  submitProps.resetForm({ values });  
};

Answer 2

在 Formik 中，dirty 是一个只读计算属性，不应该直接改变。如果值与初始值不完全相等，则返回 true。所以你需要添加另一个脏值（但不是 Formik dirty）。或者您可以手动设置 Formik 值，将 Formik dirty 设置为 true，例如

formik.setFieldValue("name", "New Name")