The progress bar component.
Attribute | Type | Default value | Description | Minimum version |
---|---|---|---|---|
percent | Float | - | A percentage between 0 and 100. | - |
show-info | Boolean | false | The percentage value appears on the right. | - |
stroke-width | Number | 6 | The thickness of the line in pixels. | - |
active-color | Color | #09BB07 | The selected progress bar color. | - |
background-color | Color | - | The unselected progress bar color. | - |
active | Boolean | false | Whether to load the animation from left to right. | - |
Illustration
Code sample
<progress percent="20" show-info/>
<progress percent="40" active/>
<progress percent="60" stroke-width="10"/>
<progress percent="80" active/>
<progress percent="80" color="#10AEFF"/>