React-final-form-array как перерисовать форму на основе нового состояния

Question

Я использую react-final-form-arrays для построения динамической системы полей, пока сценарий будет выглядеть следующим образом:

1. Пользователь нажимает на кнопку, чтобы открыть модальный редактор (Добавить / Удалить настраиваемое полеиспользуя react-final-form-array. После этого нажмите Сохранить, и он обновит основную форму.

В основной форме также используется react-final-form-array для циклического перемещения по полям и рендеринга без кнопки «Добавить / Удалить».

Я попытался привести очень пример отсюда: https://codesandbox.io/s/react-final-form-field-arrays-wbhgq?fontsize=14

В этом примере <Form1 /> на самом деле является формой редактора. После отправки, <Form2 /> будет отображаться с обновленными новыми полями.

Если я перезагружаю страницу, она работает, но, конечно, это не то, что должно было быть.

Что я должен изменить, чтобы сделать <Form2 />обновление?

Заранее спасибо

Answer 1

Я не уверен, правильно ли я вас понял, но основная идея - создать хранилище для initialValues, используя useState или состояние компонента класса

  const App = () => {
    const [initialValues, setInitialValues] = useState();

    return (
      <Styles>
        <Form1 onSubmit={setInitialValues} />
        <Form2 initialValues={initialValues} />
      </Styles>
    );
};

Если это не то, чего вы хотите достичьобъяснить это в деталях