vant/progress.md at 2f2eaaff505702283508a8f902d474ea626e04da

mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00

Yao 64ec6ce5ac Docs: add English language support (#170 )

* feat: support lang entry build

* feat: vant support lang switch

* move lang iframe-router to utils & fix router link bug

* add en-US config && add some translation

* chang async. to async_ (support superman cdn)

* add layout translation

* change nav style

* upgrade zan-doc

* fix: doc config

* upgrade zan-doc && remove useless code

* fix changelog generate path

2017-10-06 12:33:28 +08:00

1.6 KiB

Raw Blame History

Progress 进度条

使用指南

import { Progress } from 'vant';

Vue.component(Progress.name, Progress);

代码演示

基础用法

进度条默认为蓝色，使用percentage属性来设置当前进度

:::demo 基础用法

<van-progress :percentage="0"></van-progress>
<van-progress :percentage="46"></van-progress>
<van-progress :percentage="100"></van-progress>

:::

进度条置灰

:::demo 进度条置灰

<van-progress inactive :percentage="0"></van-progress>
<van-progress inactive :percentage="46"></van-progress>
<van-progress inactive :percentage="100"></van-progress>

:::

样式定制

可以使用pivot-text属性自定义文字，color属性自定义进度条颜色

:::demo 样式定制

<van-progress pivot-text="红色" color="#ed5050" :percentage="26"></van-progress>
<van-progress pivot-text="橙色" color="#f60" :percentage="46"></van-progress>
<van-progress pivot-text="黄色" color="#f09000" :percentage="66"></van-progress>

:::

API

参数	说明	类型	默认值	可选值
inactive	是否置灰	`Boolean`	`false`
percentage	进度百分比	`Number`	`false`	`0-100`
pivotText	文字显示	`String`	百分比文字	-
color	进度条颜色	`String`	`#38f`	hexvalue
textColor	进度条文字颜色	`String`	`#fff`	hexvalue

1.6 KiB Raw Blame History