Question

在使用React Final Form时，有没有一种方法可以重置表单而又不丢失SubmitSucceeded状态。我想在表单上显示成功消息，但也想在成功提交后清除它。

Answer 1

reset()清除所有状态。您可以：

a）注意submitSucceeded变为true并使用setState()在本地保存该状态，或者

b）手动清除每个字段，例如：

form.batch(() => {
  form.change('firstField', '')
  form.change('secondField', '')
  form.change('thirdField', '')
  // ...
})

两者都不是那么优雅，但是...

Answer 2

如果您不想手动重设每个字段，则可以遍历所有表单发布的值并分别重设每个值：

const submitForm = async (values, form) => {

    // Do something on form submit here

    // Reset form fields, note in a real world scenario
    // this would be inside a success callback
    Object.keys(values).forEach(key => {
        form.change(key, undefined);
        form.resetFieldState(key);
    });
};

重置表单而不会丢失SubmitSucceeded

2 个答案: