如何根据新的状态重新生成表单

Question

我正在使用react-final-form-arrays构建一个动态字段系统，到目前为止情况如下：

1. 用户单击按钮打开编辑器模式(使用react-final-form-array添加/删除自定义字段)。完成后，单击Save，它将更新主表单.

主表单还使用react-final-form-array循环字段和呈现，而不添加Add/Remove按钮。

我试着在这里放了一个很好的例子：https://codesandbox.io/s/react-final-form-field-arrays-wbhgq?fontsize=14

在该示例中，<Form1 />实际上是编辑器形式。一旦提交，<Form2 />将呈现带有更新的新字段。

如果我重新加载页面，它可以工作，但这当然不是它应该是的。

我应该更改什么使我的<Form2 />更新？

提前感谢

Answer 1

我不确定我是否正确地理解了您，但是主要的想法是使用useState或类组件的状态为useState创建一个存储

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

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

如果这不是你想达到的目标，请详细解释。