分组和验证字段
Grouping and validating fields
我们有一个表单，其中的字段分组到屏幕（部分）中。这种分离仅在视觉上完成。屏幕在屏幕左侧命名并列出（始终可见）。如果这是当前可见的部分，则屏幕名称为白色。如果某个字段有错误，屏幕名称会标记为红色，因此您始终知道哪个部分有错误。此行为在每个屏幕组件中实现（根本不是最佳的）。
客户端验证工作得很好（并不总是通过验证器实现）。但是现在我想实现相同的行为，如果我们从 API 中得到错误。意思是如果一个字段有提交错误屏幕名称是红色的，而当该字段被编辑时屏幕名称不是红色。
基本上我需要将输入字段分组到一个 Screen 组件中，该组件订阅每个字段 error、submitError 和 dirtySinceLastSubmit。然后我需要在这个 Screen 组件中定义一个新的状态变量 valid，它检查所有子状态并根据每个子状态设置适当的值。
是否可以将字段分组为 react-final-form 并订阅子状态更改？
我可能会考虑将它们分解成单独的表单并在父组件中管理总表单值，例如 Wizard Example。您的另一个选择是订阅字段集，如下所示：
这在技术上有点顽皮，hooks lint 规则会报错，但只要您从不更改字段列表，就应该没问题。
我们有一个表单，其中的字段分组到屏幕（部分）中。这种分离仅在视觉上完成。屏幕在屏幕左侧命名并列出（始终可见）。如果这是当前可见的部分，则屏幕名称为白色。如果某个字段有错误，屏幕名称会标记为红色，因此您始终知道哪个部分有错误。此行为在每个屏幕组件中实现（根本不是最佳的）。
客户端验证工作得很好（并不总是通过验证器实现）。但是现在我想实现相同的行为，如果我们从 API 中得到错误。意思是如果一个字段有提交错误屏幕名称是红色的，而当该字段被编辑时屏幕名称不是红色。
基本上我需要将输入字段分组到一个 Screen 组件中，该组件订阅每个字段 error、submitError 和 dirtySinceLastSubmit。然后我需要在这个 Screen 组件中定义一个新的状态变量 valid，它检查所有子状态并根据每个子状态设置适当的值。
是否可以将字段分组为 react-final-form 并订阅子状态更改？
我可能会考虑将它们分解成单独的表单并在父组件中管理总表单值，例如 Wizard Example。您的另一个选择是订阅字段集，如下所示：
这在技术上有点顽皮，hooks lint 规则会报错，但只要您从不更改字段列表，就应该没问题。