I am creating a form where I need to attach a file. I am using the IonInput component:
<IonList>
<IonItem>
<IonLabel position="stacked">Select application cover photo</IonLabel>
<IonInput
accept="image/*"
type="file"
value={application.cover}
placeholder="Select application cover photo"
name="cover"
onIonChange={e => setApplication({
...application,
cover: e.target.files[0]
})}
/>
</IonItem>
</IonList>
The selected file is correctly displaying inside of the IonInput but when I try to set it to the application state, I get the following error:
e.target.files is undefined
I have tried to log out the target and as I suspected, the files property is not in there. I couldn't find any property where the files are stored.
I tried running the same code but with regular input instead of IonInput and it works as expected.
Here are the versions I am using:
"@ionic/react": "^6.0.0",
"@ionic/react-router": "^6.0.0",