Progress 进度条

概述

展示操作或任务的当前进度，比如上传文件。

使用指南

在.vue中引入组件

<script>
    import progress from 'iview-mpvue/dist/components/progress/progress'
</script>

在main.js中引入样式文件

import 'iview-mpvue/dist/components/progress/style/css'

示例

<div class="progress-item">
    <i-progress percent="25"></i-progress>
    <i-progress percent="45" status="active"></i-progress>
    <i-progress percent="65" status="wrong"></i-progress>
    <i-progress percent="100" status="success"></i-progress>
    <i-progress percent="25" :hide-info="true"></i-progress>
</div>
<div class="progress-item">
    <i-progress :percent="percent" :status="status"></i-progress>
    <i-button @click="handleAdd" type="ghost">增加</i-button>
    <i-button @click="handleReduce" type="ghost">减少</i-button>
</div>

API

Progress properties

属性	说明	类型	默认值
i-class	自定义 class 类名	String	-
percent	百分比	Number	0
status	状态，可选值为 normal、active、wrong、success	String	normal
stroke-width	进度条的线宽，单位 px	Number	10
hide-info	隐藏数值或状态图标	Boolean	false