Using FileReader with React and Typescript

Viewed 128

I want to upload json file using input with type file. When I use onload method on fileReder Typescript shows me error - Cannot invoke an object which is possibly 'null'. Thank you.

const UploadCharacter = () => {
    const [data, setData] = useState<any>();

    const handleUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
        if (e.target.files) {
            const fileReader = new FileReader(); 
            fileReader.readAsText(e.target.files[0], 'UTF-8')
            fileReader.onload((e) => {  <-- Error: Cannot invoke an object which is possibly 'null'.
                console.log(e.target.result)
            })
        }


    }
    return (
        <div className={s.upload}>
            <input
                className={s.uploadInput}
                type="file"
                onChange={handleUpload}
            />
        </div>
    )
}
0 Answers
Related