mand-mobile/components/progress/README.md

1.0 KiB
Raw Blame History

title preview
Progress 进度 https://didi.github.io/mand-mobile/examples/#/progress

进度圆环,用于将数据直观地传达给用户

引入

import { Progress } from 'mand-mobile'

Vue.component(Progress.name, Progress)

代码演示

API

Progress Props

属性 说明 类型 默认值 备注
value 进度值 Number 0 0-1
size 圆环大小 Number 70 单位px
width 圆环宽度 Number - 单位px
color 圆环高亮颜色 String #fc9153 -
border-color 圆环颜色 String rgba(0, 0, 0, .1) -
fill 圆环内部填充 String transparent -
linecap 圆环两端形状 String round round, butt
rotate 圆环旋转 Number 0 -
transition 进度变化是否使用动效 Boolean false -
duration 进度变化动效时长 Number 1000 单位ms

Progress Slots

default

圆环内部内容插槽,一般用于添加文本

defs

圆环SVG内部的插槽一般用于添加defs, use元素等