问题描述
我创建了一个codesandbox，其中显示了3个Formik字段：名字，姓氏和名字。
我试图使字段name仅在用户自己修改${firstName} ${lastName}字段之前显示name，因此条件name === firstName + ' ' + lastName失败，然后name字段不应再自动更新。
面临的挑战是，由于我需要在其他类似的MyContactForm.tsx组件中重用字段间依赖关系的逻辑，因此我试图使该代码在My*Form.tsx文件中运行，因此无需更改即可重复使用“通用” MyForm.tsx组件。
解决方法
根据评论，我制作了一个sandbox，只要用户不修改display name，它将name链接到last name和display name手动。至于使这种逻辑通用，我会反对这一观点，除非您有数百个具有不同字段的表单，在这种情况下，您需要动态生成单个表单，并且对话方式会非常不同。
进行了一些更改，以使您对MyContactForm的使用保持不变。
- 在
onChange: (nextValue: string) => void中添加了一个可选的道具MyTextField，以便在更改字段值时调用该道具 - 在上述回调中添加了自定义逻辑，以便不会覆盖前一个表单逻辑。
- 在
follow内的表单中添加了MyCustomForm字段，以决定是否跟踪firstName和lastName中的更改。 （检查chat的伪代码） - 从
follow调用表单提交回调时破坏了App.tsx道具，因此开发人员仅接收他/她期望从MyContactForm看到的表单值
This是包含解决方案的分叉沙箱。