Search code examples
javascriptreactjsformikyup

Can't set 'touched' to true

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

Solution

  • 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.