Как я могу удалить ранее загруженный экземпляр изображения на следующем открытии Modal Open в "Reaction-Cropper"?

Question

Я использую эту библиотеку: https://github.com/roadmanfong/react-cropper.Мой проект связан с загрузкой и отправкой значения base64 загруженного изображения на сторону api / backend.Проблема, с которой я сталкиваюсь, заключается в том, что, когда я загружаю изображение и нажимаю кнопку «Закрыть» или «Сохранить» и снова открываю модальное окно, оно покажет ранее загруженное изображение.В этом случае изображение там не должно быть видно, я искал и обнаружил, что экземпляр должен быть удален, но я не смог понять его правильно.

Вот пример кода и коробки, с которым я работал.https://codesandbox.io/embed/32zo9wlx15

import React, { Component } from "react";
import ReactDOM from "react-dom";
import Cropper from "react-cropper";
import "cropperjs/dist/cropper.css";
import "bootstrap/dist/css/bootstrap.min.css";
import { Modal, ModalBody, ModalFooter, Button } from "reactstrap";

class ImageModal extends Component {
  constructor(props) {
    super(props);
    this.state = {
      modal: false,
      src: "",
      imgBase64: ""
    };
  }

  toggleImageModal = () => {
    this.setState({ modal: !this.state.modal });
  };

  onImageModalOpened = () => {
    this.setState({src: ''});
  };

  getImg = e => {
    e.preventDefault();
    var files = e.target.files;
    if (files && files.length) {
      this.setState({ files: files });
      const reader = new FileReader();
      reader.onload = () => {
        var image = reader.result;
        var base64Output = image.replace(/^data:image\/(png|jpg|jpeg);base64,/,"");
        this.setState({ src: image, imgBase64: base64Output });
      };
      reader.readAsDataURL(files[0]);
    } else {
      const reader = new FileReader();
      reader.onload = () => {
        var image = reader.result;
        var base64Output = image.replace(/^data:image\/(png|jpg|jpeg);base64,/,"");
        this.setState({ src: image, imgBase64: base64Output });
      };
      reader.readAsDataURL(this.state.files[0]);
    }
  };

  saveImage = e => {
    e.preventDefault();
    const { imgBase64 } = this.state;
    console.log(imgBase64);
  };

  rotateLeft = e => {
    e.preventDefault();
    return this.cropper.rotate(-45);
  };

  rotateRight = e => {
    e.preventDefault();
    return this.cropper.rotate(45);
  };

  render() {
   return (
      <div>
        <Button color="danger" onClick={this.toggleImageModal}>Open Modal</Button>
        <Modal isOpen={this.state.modal} toggle={this.toggleImageModal} onOpened={this.onImageModalOpened} className="modal-dialog modal-lg">
          <form onSubmit={this.saveImage}>
            <ModalBody>
              <Cropper
                ref={cropper => {this.cropper = cropper;}}
                src={this.state.src}
                crop={this.cropLocation}
                viewMode={2}
                responsive={true}
                restore={false}
                modal={true}
                guides={false}
                center={true}
                highlight={true}
                background={true}
                autoCrop={true}
                movable={true}
                rotatable={true}
                scalable={true}
                zoomable={false}
                cropBoxMovable={true}
                cropBoxResizable={true}
                toggleDragModeOnDblclick={true}
              />
              <div>
                <input type="file" id="inputImage" accept=".jpg,.jpeg,.png,.gif,.bmp,.tiff" onChange={this.getImg}/>
                <button onClick={this.rotateLeft}>Rotate Left</button>
                <button onClick={this.rotateRight}>Rotate Right</button>
              </div>
            </ModalBody>
            <ModalFooter>
              <button type="button" className="btn btn-sm btn-danger" onClick={this.toggleImageModal} > Close </button>
              <button type="submit" className="btn btn-sm btn-info">Save</button>
            </ModalFooter>
          </form>
        </Modal>
      </div>
    );
  }
}

ReactDOM.render(<ImageModal />, document.getElementById("root"));

Я просто не мог понять это более правильно, но я действительно много делал со своей стороны.Любая помощь приветствуется.Спасибо!