zent/src/indicator/README_zh-CN.md

一套前端设计语言和基于React的实现

---
title: Progress Indicator
subtitle: 进度指示器
path: component/indicator
group: 信息反馈
scatter: true
---

## Progress Indicator 进度指示

按顺序客观反馈完整流程的信息，且标记当前所处的进程或节点和状态。

### 建议

- 当任务复杂或存在先后关系时，进度指示将其分解成多个节点，简化用户每一步的认知与操作成本和反馈当前状态；
- 当一项任务包含多个有前后关系的节点，且需要反馈任务流转状态时，使用进度指示；
- 当一项复杂任务需要拆分成多项任务，使用导航步骤条；
- 当一项任务仅有进度不包含多个有前后节点时，请使用进度条；
- 当内容可拆分为多个没有前后逻辑关系的子内容时，请使用标签页；

### 代码演示

<!-- demo-slot-1 -->
<!-- demo-slot-2 -->
<!-- demo-slot-3 -->

### API

| 参数         | 说明                                                              | 类型    | 是否必须       | 默认值                          | 备选值 |
| ------------ | ----------------------------------------------------------------- | ------- | -------------- | ------------------------------- | ------ |
| current      | 指定当前步骤, 从 1 开始记数 (当不传值时, 默认为 0, 状态都为 wait) | number  | `0`            |                                 |
| status       | 进度指示的状态                                                    | string  | `'process'`    | `'wait'`, `'finish'`, `'error'` |
| sequence     | 是否使用默认的序号                                                | boolean | `true`         |                                 |
| onStepChange | 传该参数后 step 可点击切换 (针对 card, breadcrumb，tabs 类型)     | func    | `''`           |                                 |
| className    | 自定义额外类名                                                    |
| direction    | 步骤条的方向                                                      | string  | `'horizontal'` | `'vertical'`                    |

#### 以下功能新版设计语言已废弃，仅作为老版使用的参考

<!-- demo-slot-4 -->