前言
平常使用的框架中都是单一的进度,不能设置多个进度,这里就自定义一个支持多进度的进度条
重叠
效果
组件代码
1 | <template> |
使用方法
1 | <z-progress :values="[100,800]" :max="1000"/> |
不重叠
效果
组件代码
1 | <template> |
使用方法
1 | <z-progress2 :values="[100,800]" :max="1000"/> |
要想出现如下的效果,只需把第一个颜色设置为透明即可
如下
1 | <z-progress2 :values="[100,300]" :colors="['transparent','#1989fa']" :max="1000"/> |
中间开始
1 | <template> |
使用方法
1 | <z-progress3 |
效果如下
未悬浮
悬浮后