更新记录

V1.0.0（2023-04-11） 下载此版本

线形进度条，最简单的功能

平台兼容性

说明

该组件，是一个线形的进度条，展示操作或任务的当前进度，比如上传文件、任务完成进度等。

组件名：sa-line-progress

平台差异

基本用法

• 通过percentage设置当前的进度值，该值区间为0-100.
• 通过color设置进度条的颜色
• 通过background设置进度条的背景颜色

具体的标签，见示例：

<sa-line-progress percentage="80"></sa-line-progress>
<sa-line-progress percentage="20"></sa-line-progress>

修改颜色

<sa-line-progress percentage="60" color="red"></sa-line-progress>
<sa-line-progress percentage="76" color="#baf"></sa-line-progress>

修改背景颜色

<sa-line-progress percentage="76" color="#baf" background="#ddd"></sa-line-progress>
<sa-line-progress percentage="76" color="blue" background="lightblue"></sa-line-progress>

修改高度

<sa-line-progress percentage="76" color="blue" background="lightblue" height="20"></sa-line-progress>

修改圆角

<sa-line-progress percentage="76" color="blue" background="lightblue" height="20" radius="10"></sa-line-progress>

修改宽度

<sa-line-progress percentage="76" color="blue" background="lightblue" height="20" radius="10" width="200"></sa-line-progress>
<sa-line-progress percentage="76" color="blue" background="lightblue" height="20" radius="10" width="100%"></sa-line-progress>

API

saLineProgress Props