Why is the file object empty inside formik's values object on file upload form?

0
votes

I'm trying to upload a file using formik but the file object is always empty and I cannot quite figure it out. Here is a link to the codesandbox - https://codesandbox.io/s/formik-file-input-with-validation-forked-r5jqg?file=/src/App.js

I got this implementation from this issue filed on github - https://github.com/formium/formik/issues/926.

Your help would be greatly appreciated.

1
reactjsformik

1 Answers

1
votes

You were setting an object which was e.target.files[0] to a file which was initially undefined. you need to set e.taregt.files[0] to reader.readAsDataURL(file). not to your state object file too. you need to set name and size as that is what you need for validation schema and display. I've commented the supported formats from validation schema as for input type=file you can directly mention the accepted formats by accept key.

Here is my working modified sandbox.