React Upload file axios

import React from 'react';
import { render } from 'react-dom';
import axios from 'axios';

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedFile: null,
      percent: 0
    }
  }

  onChangeFile = (e) => {
    this.setState({
      selectedFile: e.target.files[0]
    });
  }

  upload = () => {
    const formData =  new FormData();
    formData.append('image', this.state.selectedFile);
    axios.post('http://localhost/react_upload/upload.php', formData, {
      onUploadProgress: ProgressEvent => {
        if (ProgressEvent.loaded !== ProgressEvent.total) {
          this.setState({
            percent: (ProgressEvent.loaded / ProgressEvent.total*100)
          });
        } else {
          this.setState({
            percent: 0
          });
        }
      }
    });
  }

  render() {
    return (
      <>
          <h1>Upload Image:</h1>
          <input type="file" onChange={this.onChangeFile} />
          <button onClick={this.upload}>upload</button>
          { this.state.percent !== 0 ? <progress max="100" value={this.state.percent} /> : null }
      </>
    );
  }
}

render( <App />, document.getElementById('root') );