Monday, September 14, 2020

Javascript - Upload files using React JS

This is very good resource for looking into the file operations. 


function onFileInputChange(event) {

    var file = event.target.files[0];

    console.log('File Input change ', file);

    const reader = new FileReader();

    reader.onload = (e) => {

      console.log('reader on load called ', e.target.result);

      handleSaveToPC(e.target.result)

    };

    reader.readAsText(file);

}


<input

        accept="text/*"

        className={classes.input}

        id="contained-button-file"

        multiple

        type="file"

        onChange={onFileInputChange}

      />



<label htmlFor="contained-button-file">

        <Button variant="outlined" component="span" color='primary' className={classes.button}>

          Upload

        </Button>

      </label>


References:

https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications


No comments:

Post a Comment