Progress 进度条

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

直线进度条

进度条内显示百分比标识

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

自定义进度条的颜色

可以通过 color 属性来设置进度条的颜色。该属性可以接受十六进制颜色值，函数和数组。

环形进度条

仪表盘形进度条

您也可以指定 type 属性到 dashboard 使用控制面板进度栏。

自定义内容

动画进度条

条纹进度条

API

属性

属性名	说明	类型	默认值
percentage required	percentage	`number`	0
type	进度条类型	`enum`	line
stroke-width	进度条的宽度	`number`	6
text-inside	进度条显示文字内置在进度条内（仅 `type` 为 'line' 时可用）	`boolean`	false
status	进度条当前状态	`enum`	—
indeterminate	是否为动画进度条	`boolean`	false
duration	控制动画进度条速度和条纹进度条流动速度	`number`	3
color	进度条背景色（会覆盖 `status` 状态颜色）	`string` / `function` / `Array`	''
width	环形进度条画布宽度（只在 type 为 circle 或 dashboard 时可用）	`number`	126
show-text	是否显示进度条文字内容	`boolean`	true
stroke-linecap	circle/dashboard 类型路径两端的形状	`enum`	round
format	指定进度条文字内容	`Function`	—
striped 2.3.4	在进度条上增加条纹	`boolean`	false
striped-flow 2.3.4	让进度条上的条纹流动起来	`boolean`	false

Slots

名称	说明	类型
default	自定义内容	`object`

源代码

组件 • 文档

贡献者

Delyan Haralanov

on the field of hope

Pagination 分页