钉钉小程序编辑图片 editPicture

开发应用过程中，时常要用到裁剪图片的场景。

应用场景

最常使用到头像裁剪的场景要算是头像编辑了。vue 项目可使用 vue-cropper 实现，参考：
https://blog.csdn.net/weixin_43930421/article/details/124836898

但是在钉钉小程序中，就可以很简便的调用到手机自带的图片编辑功能。

使用

head.axml

<view class="text-center margin-bottom-lg"><image onTap="selImg" mode="aspectFit" class="head" src="{{headUrl}}" onError="onError" /><view class="text-sm text-gray margin-top-xs margin-bottom padding-bottom">点击头像选择手机相册view>
view>

给图片赋予点击事件后，在 selImg 方法中选中图片后调用 editPicture 编辑

selImg() {let self = this;dd.chooseImage({count: 1,success: (res) => {if (dd.canIUse('editPicture')) {dd.editPicture({url: res.filePaths[0],success: function (re) {self.setData({headUrl: re.path})},fail: function (e) {self.setData({headUrl: res.filePaths[0]})}});} else {self.setData({headUrl: res.filePaths[0]})}}});},

注意

需要判断当前钉钉版本是否支持，调用成功，success 函数将返回图片路径 path。

dd.canIUse('editPicture')

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！