- 快速开始
- REPL
- 基本
- Icons 示例
- Button 示例
- 表单
- Input 示例
- Textarea 示例
- Radio 单选框
- Checkbox 多选框
- Switch 示例
- Select 示例
- Cascader 示例
- Form 示例
- Upload 示例
- date-picker 示例
- Drag 拖动排序
- data 数据
- Table 表格
- Tree 树形控件
- SelectTree 树形选择控件
- Pagination 分页
- progress 示例
- Empty 空状态
- 提示
- Loading 示例
- MessageBox 示例
- Dialog 示例
- Alert 示例
- Notice 示例
- 导航 Navigation
- Tabs 标签页
- NavMenu 导航菜单
- Breadcrumb 面包屑
- 其它 Others
- Clock 示例
- Drawer 示例
- Collapse 示例
- Scrollbar 示例
- Carousel 示例
- CountTo 示例
- PreviewImage 示例

## Progress 进度条

用于展示操作进度，告知用户当前状态和预期。

### 线形进度条

60%

60%

60%

60%

60%
Progress 组件设置percentage属性即可，表示进度条对应的百分比，必填，必须在 0-100。可通过status指定进度条状态

    		<BeProgress percentage={60} type="line" status="success" />
    		<BeProgress percentage={60} type="line" status="primary" />
    		<BeProgress percentage={60} type="line" status="info" />
    		<BeProgress percentage={60} type="line" status="warning" />
    		<BeProgress percentage={60} type="line" status="danger" />

显示代码

### 百分比内显

百分比不占用额外控件，适用于文件上传等场景。

70%

Progress 组件可通过 strokeWidth 属性更改进度条的高度，并可通过 textInside 属性来将进度条描述置于进度条内部。也可通过设置showText为false不显示进度条文字内容

    		<BeProgress percentage={70} type="line" strokWidth="20" textInside={true}/>
    		<BeProgress percentage={60} type="line" strokWidth="20" status="danger" textInside={true} showText = {false}

显示代码

### 自定义颜色

可以通过 `color` 设置进度条的颜色，`background`设置背景颜色

40%

    			<BeProgress percentage={40} type="line" color="#000000" background="#999999"/>

显示代码

### 环形进度条

10%
10%
可通过width设置环形进度条画布宽度

    		<BeProgress percentage={10} type="circle" />
    		<BeProgress percentage={10} type="circle" width={146}

显示代码

### 仪表盘进度条

10%

    		<BeProgress percentage={10} type="dashboard" />

显示代码

### Attributes

参数 | 说明 | 类型 | 可选值 | 默认值
--- | --- | --- | --- | ---
percentage | 百分比（必填） | number | 0-100 | 0
type | 进度条类型 | string | line/circle/dashboard | line
strokeWidth | 进度条的宽度，单位 px | number | — | 6
textInside | 进度条显示文字内置在进度条内（只在 type=line 时可用） | boolean | — | false
status | 进度条当前状态 | string | primary/success/info/warning/danger | primary
background | 设置背景颜色 | string | - | -
color | 进度条背景色（会覆盖 status 状态颜色） | string | — | ''
width | 环形进度条画布宽度（只在 type 为 circle 或 dashboard 时可用） | number |  | 126
showText | 是否显示进度条文字内容 | boolean | — | true
strokeLinecap | circle/dashboard 类型路径两端的形状 | string | butt/round/square | round
format(TODO) | 指定进度条文字内容 | function(percentage) | — | —