React 挂钩表单 - 不要在提交时重新验证

Question

我有 2 个具有以下用例的 TextField：（注意：字段是用扫描仪填写的）

在零件编号中输入任何文本并按 ENTER（零件编号的异步验证运行）
在批号中输入任何文本，然后按 ENTER 结果：批号发生异步验证，并且由于提交，它再次触发两个字段的验证。

有没有办法关闭提交时的重新验证或解决方法？我对其他表格和更多字段也会有同样的问题

https://stackblitz.com/edit/react-ts-uyggrr?file=index.tsx

Answer 1

我添加了一个额外的状态来检查验证结果：
const [passed, setPassed] = React.useState({});
每次触发验证函数时，它都会另外将其 passed 状态设置为 true/false。一旦字段的 passed === true，控制器的 validate 属性被传递：

    <Controller
      rules={{
      required: 'part number required',
      validate: () => passed['PartNumber'] || validate('PartNumber'),
      ...
    />

更多详细信息：https://stackblitz.com/edit/react-ts-rrcqpc?file=index.tsx

顺便说一句，你的项目中关于钩子的错误是因为 react 的版本不正确，你可以单击 DEPENDENCIES 旁边的刷新按钮。

React 挂钩表单 - 不要在提交时重新验证

React hook form - do not revalidate on submit

reactjs

react-hook-form