小程序裁剪图片

参考文档：https://github.com/1977474741/image-cropper
1.点击下载imageCropper到components
2.引用使用

第二步使用（第一步略过）

wxml:
<buttonbindtap="takePhone">从相册上传</button>
<image-cropper style="display: {{cropperSrc?'block':'none'}};" id="image-cropper" limit_move="{{true}}" disable_width="{{true}}" disable_height="{{true}}" disable_rotate="{{true}}" cut_top="{{412}}" width="{{width}}" height="{{height}}" imgSrc="{{cropperSrc}}" bindimageload="loadimage"></image-cropper>
<button bindtap="confirmPhone">确认裁剪上传</button>

js:
data:{
 	cropperSrc: '', // 拍照|相册选择图片路径
    cropperType: '', // 拍照|相册选择
    width: 311, //宽度
    height: 201, //高度
},
 onLoad() {
   this.cropper = this.selectComponent("#image-cropper");
},
takePhone(e) {
    wx.chooseMedia({
      count: 1,
      mediaType: ['image'],
      sourceType: [ 'camera' ,'album'],
      camera: 'back',
      success: (res) => {
        this.setData({
          cropperSrc: res.tempFiles[0].tempFilePath,
        })
      }
    })
  },
  // 图片加载完成
  loadimage: function () {
    let cropper = this.selectComponent("#image-cropper")
    cropper.imgReset()
    cropper = null
},
confirmPhone() {
    this.cropper.getImg((ares) => {
      console.log(ares.url)// 裁剪后的图片地址
    })
}

tips:裁剪图片标签不能使用wx:if来判断，不然会报错

最近忙赶项目，偷空来最做个笔记，加油！