progress 进度条组件源码分享,主要从以下两个方面:
1、progress 组件页面结构。
2、progress 组件属性。
一、组件页面结构。
二、组件属性。
2.1 percentage 百分比(必填),类型为 number,可选值 0-100,默认 0。
2.2 type 进度条类型,类型为 string,可选值 line/circle/dashboard,默认 line。
2.3 stroke-width 进度条的宽度,单位 px,类型为 number,默认值 6。
2.4 text-inside 进度条显示文字内置在进度条内(只在 type=line 时可用),类型为 boolean,默认 false。
2.5 status 进度条当前状态,类型为 string,可选值 success/exception/warning,无默认值。
2.6 color 进度条背景色(会覆盖 status 状态颜色),类型为 string/function/array,无默认值。
2.7 width 环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用),类型为 number,默认 126。
2.8 show-text 是否显示进度条文字内容,类型为 boolean,默认 true。
2.9 stroke-linecap circle/dashboard 类型路径两端的形状,类型为 string,可选值 butt/round/square,默认值 round。
2.10 format 指定进度条文字内容,类型为 function(percentage),无默认值。
2.11 define-back-color 指定进度条底色(支持 hex 格式),类型为 string,无默认值。
2.12 text-color 指定进度条字体颜色(支持 hex 格式),类型为 string,无默认值。