React Typescript: Get files from file input

files is property of an input (HTMLInputElement) and not of the event.

So it should be event.currentTarget.files


    console.log(state.photo) // returns nothing

This returns nothing because when you set state its value is available on the next render cycle. So if you select another file with your file input, then, console.log(state.photo) will log the previous file name.

If you want to log the current selected file, use:

    console.log(event.target.value)

Take a look at my example: https://codesandbox.io/s/pensive-cdn-1fnuv

And

    console.log(event.files[0]);

will throw error. Don't use it.