# Progress 进度条
用于展示操作的当前进度。
## 基本用法
设置百分比 `percentage`。
```html
```
## 隐藏进度文字
设置 `hide-text` 隐藏进度文字。
```html
```
## 设置状态
设置 `status`,告知用户当前状态和预期。
```html
```
## 修改颜色
设置 `color` 修改进度条颜色。
```html
```
`color` 也可以设置为数组或者函数。数组如果只传入颜色,则自动计算每个颜色的进度边界。函数需要返回一个颜色值。
```html
```
数组也可以设置为以下格式:
```html
```
```typescript
const colorObject = ref([
{
color: 'yellow',
percentage: 30
},
{
color: 'red',
percentage: 60
},
{
color: 'blue',
percentage: 80
},
{
color: 'black',
percentage: 90
}
])
const percentage = ref(100)
```
## Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 | 最低版本 |
|-----|-----|------|-------|-------|--------|
| percentage | 进度数值,最大值100 | number | - | 0 | - |
| hide-text | 隐藏进度文字 | boolean | - | false | - |
| color | 进度条颜色 | string / array | - | linear-gradient(315deg, rgba(81,124,240,1) 0%,rgba(118,158,245,1) 100%) | - |
| status | 进度条状态 | string | success / danger | - | - |
| duration | 进度增加1%所需毫秒数 | number | - | 30 | - |
## 外部样式类
| 类名 | 说明 | 最低版本 |
|-----|------|--------|
| custom-class | 根节点样式 | - |