更新记录
1.0.6(2023-11-29) 下载此版本
删除了我个人的oss信息,有老六用我oss信息上传图片视频,给我搞欠费了
1.0.5(2023-11-29) 下载此版本
新增接口上传方式
1.0.4(2023-07-20) 下载此版本
新增使用举例
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
√ | × |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.1.0 | × | √ | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 | 鸿蒙元服务 |
---|---|---|---|---|
× | × | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
zjq-study
联系方式
有问题可加QQ:1544177291
新增接口上传方式
当action为uniCloud,上传方式为uniCloud,当action为空时,上传方式为前端直传oss,为具体的上传接口地址时,上传方式为接口上传
oss信息更换
uni-modules/zjq-upload/components/iz-aloss-uploader/config.js
按照配置文件里面的信息填写需要上传到的oss信息
上传图片及视频命名
uni-modules/zjq-upload/components/iz-aloss-uploader/iz-aloss-uploader.js
const aliyunFileKey = xmm + '/' + Typename + path + '.' + fix.replace('.', '');
该行代码为命名,可自己按照需求修改
参数 | 说明 | 类型 | 默认值 | 可选 |
---|---|---|---|---|
value | v-modules绑定的值,用于回显以及给予默认值 | Array | 无 | 无 |
fileType | 文件类型 'image', 'video', 'all' | String | all | image、video、all |
isPreviewImage | 是否开启预览图片 | Boolean | true | false、true |
remove | 是否显示删除按钮 | Boolean | true | false、true |
add | 是否显示添加按钮 | Boolean | true | false、true |
max | 最多显示数量 | Number | 9 | 无 |
listStyle | 列表样式 | Object | 无 | 无 |
还有一些其他参数可以自己到zjq-upload.vue中的props里面看
使用
html
<zjq-upload v-model="ceshifun" closeImg="/static/cha.png" @onSuccess="dataurl"
:listStyle="{columns: 3,columnGap: '20rpx',rowGap:'20rpx',padding:'10rpx',height:'200rpx',radius:'20rpx'}">
<template v-slot:addImg> //这个插槽是用来换上传图片的图片的,更换自己的路径,也可以直接删掉
<view>
<image style="width: 200rpx;height: 200rpx;margin-left: 20rpx;" src="/static/public/shangchuan.png"
mode="">
</image>
</view>
</template>
</zjq-upload>
data数据
data() {
return {
ceshifun: [],
}
},
js
dataurl(e) {
this.ceshifun.push({
path: e
})
},