Field-level validation not working when using `useField` hook
See original GitHub issue🐛 Bug report
Current Behavior
When using the useField
hook, field-level validation using the validate
property doesn’t work.
const [field] = useField({ name, validate: () => 'not good' });
Expected behavior
The validate prop should work just like its Field
counterpart.
Reproducible example
https://codesandbox.io/embed/formik-codesandbox-template-p5zc1
Suggested solution(s)
Manually registering the validate function does the trick for me:
useEffect(() => {
registerField(name, {
validate: () => 'not good'
});
return () => unregisterField(name);
}, [name, registerField, unregisterField]);
Your environment
Software | Version(s) |
---|---|
Formik | 2.0.1-rc.9 |
React | 16.8.6 |
TypeScript | 3.5.2 |
Browser | Chrome 75 |
npm/Yarn | npm |
Operating System | Ubuntu 19.04 |
Issue Analytics
- State:
- Created 4 years ago
- Comments:10 (2 by maintainers)
Top Results From Across the Web
React Formik Tutorial - 25 - Field Level Validation - YouTube
Courses - https://learn.codevolution.dev/ Support UPI - https://support.codevolution.dev/ Support PayPal ...
Read more >useField() - Formik
A custom React Hook that returns a 3-tuple (an array with three elements) containing FieldProps , FieldMetaProps and FieldHelperProps . It accepts either...
Read more >useField() hook - Formiz
This will update the isValidating state at the field level and also at the form and step levels. Notify the start of async...
Read more >Final Form Docs – `useField()`
useField () returns FieldRenderProps . It will manage the rerendering of any component you use it in, i.e. the component will only rerender...
Read more >MUI & Formik: Validation doesn't trigger for useField
I just reproduced based on the working example what you provided and realized that you set helpers.setTouched manually.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Why is this behavior not documented here?
I ran into this page by searching how to do field-level validation using hooks.
@mordechaim you’re free to open a PR to update the documentation