React 挂钩表单 - 不要在提交时重新验证
React hook form - do not revalidate on submit
我有 2 个具有以下用例的 TextField:
(注意:字段是用扫描仪填写的)
- 在零件编号中输入任何文本并按 ENTER(零件编号的异步验证运行)
- 在批号中输入任何文本,然后按 ENTER
结果:批号发生异步验证,并且由于提交,它再次触发两个字段的验证。
有没有办法关闭提交时的重新验证或解决方法?
我对其他表格和更多字段也会有同样的问题
我添加了一个额外的状态来检查验证结果:
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 旁边的刷新按钮。
我有 2 个具有以下用例的 TextField: (注意:字段是用扫描仪填写的)
- 在零件编号中输入任何文本并按 ENTER(零件编号的异步验证运行)
- 在批号中输入任何文本,然后按 ENTER 结果:批号发生异步验证,并且由于提交,它再次触发两个字段的验证。
有没有办法关闭提交时的重新验证或解决方法? 我对其他表格和更多字段也会有同样的问题
我添加了一个额外的状态来检查验证结果:
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 旁边的刷新按钮。