|
||
---|---|---|
.. | ||
demo | ||
test | ||
README.en-US.md | ||
README.md | ||
component.js | ||
index.vue |
README.en-US.md
title | preview |
---|---|
Progress | https://didi.github.io/mand-mobile/examples/#/progress |
Progress circle, generally used to communicate data intuitively to users
Import
import { Progress } from 'mand-mobile'
Vue.component(Progress.name, Progress)
Code Examples
API
Progress Props
Props | Description | Type | Default | Note |
---|---|---|---|---|
value | progress value | Number | 0 |
0-1 |
size | circle size | Number | 70 |
unit px |
width | circle stroke width | Number | - | unit px |
color | circle stroke highlight color | String | #fc9153 |
- |
border-color | circle stroke color | String | rgba(0, 0, 0, .1) |
- |
fill | circle fill color | String | transparent |
- |
linecap | shape of end | String | round |
round , butt |
rotate | - | Number | 0 |
- |
transition | use transition when value changes | Boolean | false |
- |
duration | transition duration | Number | 1000 |
unit ms |
Progress Slots
default
slot inside circle, generally used to add text
defs
slot inside circle svg, generally used to add defs
, use
elements, etc