使用 yup 验证通用反应钩子表单组件失败

Question

我正在尝试为反应钩子表单的文本输入制作通用组件。
这是沙盒的链接：
https://codesandbox.io/s/eager-https-0osjz?file=/src/App.tsx 问题在于验证，它是在我将代码移动到单独的组件时开始的。
我在这里做错了什么？
我怀疑我在第一次使用 TS 时遇到了一些问题。

Answer 1

有几个问题：

• 您使用的是两个 useForm 而不是一个，这就是不显示错误和不提交表单的原因
• 控制器需要control props 才能工作，您可以从useForm 获得控制权并将其传递给子组件或使用useFormContext 检索它

您的工作示例：https://codesandbox.io/s/quizzical-alex-d7gpn?file=/src/App.tsx