title: TypeError: this.$refs.cropper.getCroppedCanvas is not a function
body: <p>I want to crop, rotate photo from Image url. I converted image from url to base64 string. Image is showing on  component.
  But when i try to crop image getting
  TypeError: this.$refs.cropper.getCroppedCanvas is not a function.
  I installed it by <strong>npm install --save vue-cropperjs</strong> from <a href="https://www.npmjs.com/package/vue-cropperjs" rel="nofollow noreferrer">https://www.npmjs.com/package/vue-cropperjs</a>.</p>
  <p>I have imported it to the following local component:</p>
  <pre><code>   &lt;tamplate&gt;
       &lt;VueCropper ref=&quot;cropper&quot; :src=&quot;imgSrc&quot; alt=&quot;Source Image&quot; :modal='true'&gt;
   &lt;/VueCropper&gt;
  &lt;/template&gt; 
  
  &lt;script lang=&quot;js&quot;&gt;
  import VueCropper from 'vue-cropperjs';
  import 'cropperjs/dist/cropper.css';
  
  export default Vue.extend({
  components: { VueCropper} 
  
       
  
  
  setImage(path) {
      var that = this;
  
      function toDataURL(url, callback) {
          var xhr = new XMLHttpRequest();
          xhr.onload = function () {
              var reader = new FileReader();
              reader.onloadend = function () {
                  callback(reader.result);
              }
              reader.readAsDataURL(xhr.response);
          };
          xhr.open('GET', url);
          xhr.responseType = 'blob';
          xhr.send();
      }
  
      toDataURL(path, function (dataUrl) {
  
          that.imgSrc = dataUrl;
  
      })
  
  
  },
  cropImage() {
      // get image data for post processing, e.g. upload or setting image src
      this.cropImg = this.$refs.cropper.getCroppedCanvas().toDataURL();
  },
  rotate() {
      // guess what this does :)
      this.$refs.cropper.rotate(90);
  },
  });
  &lt;/script&gt;
  </code></pre>