更新记录
1.0.7(2022-06-01)
下载此版本
修改插件标题
1.0.6(2022-06-01)
下载此版本
更新文档
1.0.5(2022-06-01)
下载此版本
更新文档
查看更多
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.1.0 |
× |
√ |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
× |
√ |
× |
× |
× |
× |
× |
jr-avatar-clip (头像裁剪)
使用方法
引入、注册组件 ,示例如下;
<template>
<view class="">
<jr-avatar-clip
selWidth="480upx"
selHeight="480upx"
ref='avatar'
fileType='png'
:canRotate="false"
:avatarSrc="avatar"
@upload="uploadHandle"
quality="1"
avatarStyle="width: 45px; height: 45px;"
>
</jr-avatar-clip>
</view>
</template>
<script>
import jrAvatarClip from '@/uni_modules/jr-avatar-clip/components/jr-avatar-clip/jr-avatar-clip.vue'
export default {
components:{
jrAvatarClip
},
data(){
return {
avatar: 'https://uhr-sit-1302914566.cos.ap-guangzhou.myqcloud.com/uhr/image/2022-03-08/b61a93d5-b12f-4b0b-8ace-0c7a8eadf6e7.png'
}
},
methods:{
uploadHandle(e){
}
}
}
</script>
<style>
</style>
Attributes
属性 |
说明 |
类型 |
默认值 |
avatarSrc |
默认头像 |
string |
- |
avatarStyle |
头像样式 |
object |
{width: 150upx; height: 150upx; border-radius: 100%;} |
selWidth |
裁剪区域的宽 |
string |
- |
selHeight |
裁剪区域的高 |
string |
- |
fileType |
裁剪出的文件类型 |
string |
- |
expWidth |
导出图片宽度 |
string |
- |
minScale |
裁剪最小的缩放值 |
string |
- |
maxScale |
裁剪最大的缩放值 |
string |
- |
canScale |
是否可以缩放 |
boolean |
false |
Events
事件名称 |
说明 |
回调参数 |
upload |
裁剪完成回调 |
上传完成后的Object 注:当为H5时候 取 对象中的base64属性,非H5取path属性 |