title: [React Cropper]: Cannot read property 'getCroppedCanvas' of undefined
body: <p>I'm using the library "React Cropper" (<a href="https://www.npmjs.com/package/react-cropper" rel="nofollow noreferrer">https://www.npmjs.com/package/react-cropper</a>).</p>
  
  <p>I have this code (as many examples):</p>
  
  <pre><code>import React from 'react';
  import Cropper from 'react-cropper';
  
  export default class PublishPhoto extends React.Component {
  constructor(props) {
      super(props);
      this.state = 
      {
          src: '',
          cropResult: null,
      };
      this.onChangeImage = this.onChangeImage.bind(this);
      this.cropImage = this.cropImage.bind(this);
  }
  
  onChangeImage(e)
  {
      e.preventDefault();
      let files;
      if (e.dataTransfer) {
        files = e.dataTransfer.files;
      } else if (e.target) {
        files = e.target.files;
      }
      const reader = new FileReader();
      reader.onload = () =&gt; {
        this.setState({ src: reader.result });
      };
      reader.readAsDataURL(files[0]);
  }
  
  cropImage() 
  {
      if (typeof this.cropper.getCroppedCanvas() === 'undefined') {
        return;
      }
      this.setState({
        cropResult: this.cropper.getCroppedCanvas().toDataURL(),
      });
  }
  
  render(){
    return(
          &lt;div&gt;
              &lt;div&gt;Seccion de publicar foto&lt;/div&gt;
  
              &lt;input type="file" id="uploadImage" name="uploadImage" onChange={this.onChangeImage} /&gt;
  
              &lt;Cropper
                  style={{ height: 400, width: '100%' }}
                  //aspectRatio={16 / 9}
                  preview=".img-preview"
                  guides={false}
                  src={this.state.src}
                   /&gt;
  
                  &lt;button onClick={this.cropImage} style={{ float: 'right' }}&gt;
                      Cortar imagen
                  &lt;/button&gt;
  
  
          &lt;/div&gt;
  
      );  
  }
  }
  </code></pre>
  
  <p>But when do click on "Cortar imagen" buttom the javascript console show me the error: Uncaught TypeError: Cannot read property 'getCroppedCanvas' of undefined.</p>
  
  <p>I tried use "this.refs.cropper.getCroppedCanvas()" instead "this.cropper.getCroppedCanvas()" but the "this.refs" is a empty object.</p>
  
  <p>Thanks :/</p>