React setState不是函数

Question

    fileChangedHandler = event => {
    event.preventDefault();
    event.persist();
    new ImageCompressor(event.target.files[0], {
    quality: .6,
    success(result) {
      this.setState({selectedFile: result})
    },
    error(e) {
      console.log(e.message);
    },
  });
  }

That is the function above and I want to change state after success but I'm getting setState is not a function

and this is how I trigger it:

<input style={{display: 'none'}} type="file" onChange={this.fileChangedHandler} ref={fileInput => this.fileInput = fileInput}/>
<button type='button' onClick={() => this.fileInput.click()} className='col m3 btn' style={{textTransform: 'none'}}>Choose image</button>

Answer 1

success is regular function that has dynamic this context that is determined by a caller ( ImageCompressor ).

Since fileChangedHandler method is an arrow, this refers to component class instance that has setState method.

In order to reach lexical this inside success , it should be an arrow:

...
success: (result) => {
  this.setState({selectedFile: result})
},
...