如何在页面/屏幕之间共享 react-final-form

Question

• 反应原生
• 反应最终形式
• 矩形导航

我需要将我的表单拆分为子表单。子表单将在 React-Native 的不同屏幕上呈现，但我需要它们成为同一个表单处理对象的一部分。我需要从每个子表单访问完整的表单状态（对于所有字段），但每个子表单只会呈现一些字段。

有没有办法将表单对象传递给另一个屏幕/组件并继续使用主表单中的状态处理/验证？

例子：

MainForm
  FieldX
  FieldY
  Button to open subform A
    SubFormA
      FieldA1
      FieldA2
      FieldX <- reused from main form, might be readonly in subform A
      Button to go back to main form
  Button to open subform B
    SubFormB
      FieldB1
      Button to go back to main form

表单的实际提交只能从 MainForm 执行。我使用较旧的表单库进行了此设置，但我使用 Modals 来显示子表单，这些子表单内联在主表单中。但我想停止使用模式，而是通过以某种方式传递表单对象来推送具有子表单功能的单独屏幕（使用反应导航）。

Answer 1

您可以使用React Redux 拥有一个能够共享所有信息的商店。 创建您的商店并发送您的操作，然后您可以从那里获取表单的所有变量（字段）。

Answer 2

我又摸索了一些，找到了一种方法。以为我会回答这个让其他人找到。

• Form 组件的 render 属性实际上是获取表单实例作为参数。

• Form 组件也将表单实例作为道具

这两个特性使得将表单实例简单地传递给另一个表单组件成为可能。我在同一个屏幕上尝试了这个，它就像一个魅力。我希望当我使用 react-navigation 推送下一个屏幕时，主 Form 被卸载时不会遇到麻烦。

---

edit：它在屏幕之间也能完美运行。我通过 react-navigations params 对象将表单实例发送到子表单。