vue-cropper-h5移动端实现拍照截取上传图片

vue-cropper-h5文档地址：https://www.npmjs.com/package/vue-cropper-h5

1、下载vue-cropper-h5

npm i vue-cropper-h5

2、在需要的页面引入

<script>
  import VueCropperH5  from 'vue-cropper-h5'

  export default{
  components:{
   VueCropperH5  
   }
}
</script>

3、使用：我这里是直接与img标签配合使用的一般是用组件库的upload配合使用或是与input的文件上传配合

 <img :src="imgUrl" class="avatar" @click="upLoad"></img>
<vue-cropper-h5  class="cropper"  @canceltailor="canceltailor" @getbase64Data="getbase64Data" @getFile="getFile" :canMoveBox="true":fixed="false"  ref="cropper"