title: Set state with axios config event
body: <p>How do I add Axios event result to the state? </p>
  
  <ol>
  <li>Upload file with axios post method</li>
  <li>Set state into config <code>onUploadProgress</code> event of axios post metod</li>
  <li>Receive the following error</li>
  </ol>
  
  <p><a href="https://i.stack.imgur.com/F5WXJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/F5WXJ.png" alt="enter image description here"></a></p>
  
  <p>This is my code:</p>
  
  <pre><code>export default class StudioAlbumUpload extends Component{
  
      constructor(props){
          super(props);
  
          this.state = { prog: 0 };
      }
  
      onDrop(acceptedFiles, rejectedFiles){
          var files = acceptedFiles;
          var data = new FormData();
          data.append('file', files[0]);
  
          var config = {
              onUploadProgress: function(progressEvent) {
                  var percentCompleted = Math.round( (progressEvent.loaded * 100) / progressEvent.total );
                  //How set state with percentCompleted?
                  this.setState({prog: percentCompleted}); 
              }
          };
  
          axios.post(`${ROOT_URL}/api/studio/album/upload`, data, config)
              .then((response) =&gt; console.log('hello'))
              .catch(error =&gt; console.log(error));
      }
  
      render() {
          return (
              &lt;div&gt;
                  {this.state.prog}
                  &lt;Dropzone onDrop={this.onDrop} maxSize={5120} accept={'image/*'}&gt;
                      &lt;div&gt;Try dropping some files here, or click to select files to upload.&lt;/div&gt;
                  &lt;/Dropzone&gt;
              &lt;/div&gt;
          );
      }
  }
  </code></pre>