使用vue-image-crop-upload将图片压缩成bas

template

  <a class="btn" @click="toggleShow">设置头像</a>
  <my-upload field="img" @crop-success="cropSuccess" v-model="show" :width="100" :height="100" img-format="png"></my-upload>
  <img :src="avatar">

js

  import myUpload from "vue-image-crop-upload";
  
  export default {
    data() {
      return {
        avatar: "",
        show: false
      }
    },
   components: {
       "my-upload": myUpload
    },
    methods: {
         toggleShow() {
            this.show = !this.show;
        },
        cropSuccess(imgDataUrl) {
          //  imgDataUrl其实就是经过base64转码过的图片
          this.avatar = imgDataUrl;
        }
     }
  }