title: Uncaught TypeError: Cannot read property 'width' of undefined at Cropper.zoomTo
body: <p>I am using react-cropper version 2.0.0. I don't really understand the problem. It occurs in cropperjs zoomTo method. I have initialized the cropper instance on bootstrap modal. I see the cropper is initialized correctly and also show canvasData successfully but it still throws some error when it is parsing zoomTo function within cropperjs. It is unable to get the canvasData</p>
  <p>Here's my react code</p>
  <pre><code>class CropperModal extends React.Component{
  
         constructor(){
          super(); 
          this.state={
           
              cropperInstance: '',
              sourceImage:'',
  cropperSize: '',
            
              
          }
        
          this.onCropperInit = this.onCropperInit.bind(this);
       
      }        
      UNSAFE_componentWillReceiveProps(newProps){
           let image = new Image();
           image.src = newProps.originalImage;
           const _this = this;
           image.onload = function () {
              
               if (this.width &lt;= this.height) {
                   _this.setState({
                       sourceImage: newProps.originalImage,
                       cropperSize: {
                           height: &quot;100%&quot;,
                           width: &quot;auto&quot;
                       },
                   })
               } else {
                   _this.setState({
                       sourceImage: newProps.originalImage,
                       cropperSize: {
                           height: &quot;auto&quot;,
                           width: &quot;100%&quot;
                       },    
                   })
               }
  onCropperInit(cropper) {
          this.setState({
              cropperInstance: cropper    
          })
      
      console.log(cropper)
      }
          render(){
           
              return(
              
                      &lt;Modal show={this.props.showModal} onHide={this.props.hideModal} dialogClassName=&quot;ModalSize&quot; onEnter={this.props.onEnter}&gt;
                      &lt;Modal.Header closeButton&gt;
                          Image adjustment
                      &lt;/Modal.Header&gt;
                      &lt;Modal.Body className=&quot;modalBodyHeight&quot;&gt;
                          &lt;Row&gt;
                              &lt;Col lg={6} className=&quot;cropperImage&quot;&gt;
                                 &lt;Cropper  onInitialized={this.onCropperInit} src={this.state.sourceImage} style={{height: this.state.cropperSize.height,width: this.state.cropperSize.width}} aspectRatio=&quot;1.4&quot; guides={true}  dragMode=&quot;move&quot;  /&gt;
                              
                          &lt;/Col&gt;
                              &lt;Col lg={3}&gt;
             
                                  &lt;div className=&quot;imgPreview&quot;&gt; 
                                  &lt;/div&gt;
                                  
                                  
                              &lt;/Col&gt;
                             
                          &lt;/Row&gt;  
                          &lt;/Modal.Body&gt;
                     
                      &lt;/Modal&gt;
                      
              )
          }
      }
  
  export default CropperModal;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/28re5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/28re5.png" alt="enter image description here" /></a></p>