How to upload files using React?

Question

so currently I am trying to upload a file, and save it on the Google Clouds. But I am stuck at how to get the input file using React-Redux.

Basically, my back-end pa

Answer 1

Checkout this blog, very well explained upload feature in react with example. Below is upload code from above blog:

handleUploadedFiles = files => {
        var reader = new FileReader();
        reader.onload = (e) => {
            //Split csv file data by new line so that we can skip first row which is header
            let jsonData = reader.result.split('\n');    
            let data = [];
            jsonData.forEach((element, index) => {
                if(index) {
                     //Split csv file data by comma so that we will have column data
                    const elementRaw = element.split(',');
                    console.log(element, index);
                    if(element) {
                        let param = {
                            'id' : elementRaw[0],
                            'name' : elementRaw[1],
                            'age' : elementRaw[2],
                            'address' : elementRaw[3]
                        }
                        data.push(param);
                    }
                }
            });
        }
        console.log("TCL: Dashboard -> reader.readyState", reader.readyState)          
        reader.readAsText(files[0]);
    }

Answer 2

You cant handle onChange file by method <input type="file" onChange={this.handleChangeFile.bind(this)}>

handleChangeFile(event) {
  const file = event.target.files[0];
  let formData = new FormData();
  formData.append('file', file);
  //Make a request to server and send formData
}