Сбросить форму без потери submitSucceeded

При использовании React Final Form есть ли способ сбросить форму, не теряя состояния submitSucceeded. Я хочу отобразить сообщение об успешном завершении в форме, но я также хочу удалить его после успешной отправки.

1 ответ

Решение

reset() очищает все состояние. Вы можете либо:

а) Обратите внимание, когда submitSucceeded становится true и сохранить это состояние локально с setState(), или же

б) Очистить каждое поле вручную, например:

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

Ни то, ни другое невероятно элегантно, но...

Если вы не хотите вручную сбрасывать каждое поле, вы можете просмотреть все опубликованные значения формы и сбросить каждое отдельно:

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);
    });
};
Другие вопросы по тегам