更新记录
1.0.0(2024-12-05)
下载此版本
- 支持单图/多图上传
- 支持自定义列数和间距
- 支持上传进度显示
- 支持预览和删除功能 支持自定义上传配置
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.1.0 app-vue |
× |
√ |
√ |
√ |
√ |
√ |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
× |
√ |
√ |
√ |
wht-img-upload
一个简单易用的图片上传组件,支持单图/多图上传,适用于 uni-app 项目。
特性
- 支持单图/多图上传
- 支持自定义列数和间距
- 支持上传进度显示
- 支持预览和删除
- 支持自定义上传配置
安装
在插件市场中搜索 wht-img-upload
并导入到项目中。
基础用法
<template>
<wht-img-upload v-model="imageList" />
</template>
<script>
export default {
data() {
return {
imageList: []
}
}
}
</script>
API
Props
参数 |
说明 |
类型 |
默认值 |
modelValue/v-model |
图片列表 |
Array |
[] |
max |
最大上传数量 |
Number |
9 |
mode |
上传模式,可选值:single/multi |
String |
'multi' |
columns |
列数 |
Number |
3 |
gap |
间距(rpx) |
Number |
24 |
itemHeight |
图片高度(rpx) |
Number |
216 |
buttonText |
上传按钮文字 |
String |
'上传图片' |
showButtonText |
是否显示按钮文字 |
Boolean |
true |
uploadConfig |
上传配置 |
Object |
- |
Events
事件名 |
说明 |
回调参数 |
update:modelValue |
图片列表更新时触发 |
imageList |
choose |
选择图片后触发 |
imageList |
delete |
删除图片时触发 |
index |
error |
上传错误时触发 |
error |