Can't set 'touched' to true

user_12860919 0
Viewed 10528

I just trying to create a custom Formik <Field />. It is a <input type = file /> with opacity=0 and depending of values i styling my <Error /> component and <input type = text />. values.photo is ok. The problem is that touched never becoming true, so i can't show my <Error /> component. Can you explain what goes wrong? https://codesandbox.io/s/purple-violet-qgxr3?file=/src/components/FileInput.js

yup formik reactjs javascript
2 Answers

in your file input component just add this:

form.setTouched({...form.touched,[field.name]: true });

setTouched take object of fields and field.name is the file input name.

user_115280640

when you handle the file input by listening to onChange event. As soon as that onChange method is called you can mark your field asTouched by calling .markAsTouched() so that it would show the error if the condition in validated.

user_136138240
Related