更新记录
1.0.0(2023-11-07)
下载此版本
可视化任务进度条(自定义颜色、自定义过度效果)
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
× |
× |
× |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
× |
× |
× |
× |
× |
× |
× |
× |
使用方法
<ytySquareFill label="自定义标题" :value="0.2" :time="3" :width="300" :opacity="0.2" backgroundColor="#5555ff">
</ytySquareFill>
组件引入
import ytySquareFill from '@/components/yty-square-fill/yty-square-fill.vue'
组件注册
export default{
components:{
ytySquareFill
}
}
组件传参
参数名 |
参数描述 |
类型 |
默认值 |
是否必填 |
value |
值 |
Number |
0.35 |
是 |
label |
描述 |
String |
标题 |
否 |
width |
宽度 |
Number |
300rpx |
否 |
opacity |
透明度 |
Number |
0.5 |
否 |
backgroundColor |
背景色 |
16进制颜色 |
#8A2BE2 |
否 |
time |
动画时长 |
Number |
3s |
否 |
组件插槽
插槽名称 |
说明 |
title |
标题自定义内容,可以在此传入自定义标题,用于自定义排版 |
value |
值自定义内容,可以在此传入自定义值,用于自定义排版 |