react upload file axios
import React from 'react' import axios from 'axios'; class FileUpload extends React.Component{ constructor(){ super(); this.state = { selectedFile:'', } this.handleInputChange = this.handleInputChange.bind(this); } handleInputChange(event) { this.setState({ selectedFile: event.target.files[0], }) } submit(){ const data = new FormData() data.append('file', this.state.selectedFile) console.warn(this.state.selectedFile); let url = "http://localhost:8000/upload.php"; axios.post(url, data, { // receive two parameter endpoint url ,form data }) .then(res => { // then print response status console.warn(res); }) } render(){ return( <div> <div className="row"> <div className="col-md-6 offset-md-3"> <br /><br /> <h3 className="text-white">React File Upload - Nicesnippets.com</h3> <br /> <div className="form-row"> <div className="form-group col-md-6"> <label className="text-white">Select File :</label> <input type="file" className="form-control" name="upload_file" onChange={this.handleInputChange} /> </div> </div> <div className="form-row"> <div className="col-md-6"> <button type="submit" className="btn btn-dark" onClick={()=>this.submit()}>Save</button> </div> </div> </div> </div> </div> ) } } export default FileUpload;
