进度条

v-progress-linear 组件常用于将数据实例化给用户。它支持未定的值，例如表现加载或者过程，也可以用于表示总量确定的值（当然也可以显示加载过程的值）。

使用

在其最简单的形式中，v-progress-linear 显示为一根水平的进度条。使用 value 属性控制它的加载过程。

API

组件	描述
v-progress-linear	主要组件

示例

属性

缓冲值

主值由 v-model 控制，而缓冲值则由 buffer-value 属性控制。

颜色

您·可以使用 color 和 bg-color 属性设置进度条的颜色。

未定式进度条

使用 indeterminate 属性， v-progress-linear 会保持动画状态。

反转

显示反转的进度条。此组件支持从右到左（RTL），设置 reverse 属性即可开启从右到左模式的进度条。

圆角

rounded 属性可用于设置 v-progress-linear 的圆角。

INFO

使用 rounded-bar 属性可以向值条的内边缘添加边框半径。默认情况下，值条的边框半径等于你的应用程序的默认边框半径，除非通过 rounded 属性或 SASS 变量提供了不同的值。

流动状进度条

stream 属性可以搭配 buffer-value 告诉用户正在进行某些动作。

条纹状进度条

此属性会在 v-progress-linear 的值部分增加斑马状条纹。另外在使用 indeterminate 属性的进度条时没有效果。

插槽

默认值

当使用 v-model 时，v-progress-linear 组件将对用户输入进行响应。你可以使用默认插槽或绑定本地模型来显示在进度条内部。如果你正在寻找线性类型组件的高级功能，请查看 v-slider。

其他

定值线条

进度条组件有一个由 v-model 修改的确定状态。

文件加载器

v-progress-linear 组件非常适合向用户传达他们正在等待响应的信息。

工具栏加载器

通过使用 absolute 属性，我们可以将 v-progress-linear 组件定位在 v-toolbar 的底部。我们还使用 active 属性来控制进度条的可见性。

缓冲颜色和不透明度

TIP

此功能在 v3.6.0 (Nebula) 引入。

可以使用 buffer-color 和 buffer-opacity 属性来控制缓冲颜色和不透明度。这使你能够创建多色进度条。