更新记录
1.0.0(2020-10-26) 下载此版本
微信小程序啥时候能直接支持svg
平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
- | - | - | - | √ | - | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
- | - | - | - | - | - | - | - | - | - | - |
组件在components目录下upload-btn文件夹中
组件注册
<upload-btn :options="options" ref="upload" @click.native="onClick" @uploaded="uploaded"></upload-btn>
组件调用
onClick () {
clearInterval(this.timer)
this.options.progress = 0
// 触发按钮的点击
this.$refs['upload'].handlerBtn()
// 模拟上传进度
this.timer = setInterval(() => {
if (this.options.progress < 1) {
this.options.progress += 0.005
} else {
clearInterval(this.timer)
}
},20)
},
上传回调
uploaded () {
console.log('uploaded:','上传成功!')
}
options(必传)属性说明
属性名 | 类型 | 说明 |
---|---|---|
scale | Number | 按钮缩放比例;取值:(0,1] |
firstGradColor | String | 按钮渐变背景色第一个值 |
secGradColor | String | 按钮渐变背景色第二个值 |
progress | Number | 上传进度;取值:[0,1] |
firtProgressColor | String | 进度条渐变背景色第一个值 |
secProgressColor | String | 进度条渐变背景色第二个值 |