vant/docs/demos/views/progress.vue
neverland d8b6ad7d54
[new feature] add i18n support (#310)
* fix: Tabbar icon line-height

* [new feature] progress add showPivot prop

* [new feature] TabItem support vue-router

* [new feature] update document header style

* [Doc] add toast english ducoment

* [new feature] add i18n support

* feat: Extract demos from markdown

* feat: Base components demos

* [new feature] complete demo extract & translate

* [fix] text cases

* fix: add deepAssign test cases

* fix: changelog detail

* [new feature] AddressEdit support i18n
2017-11-15 20:08:51 -06:00

48 lines
1.1 KiB
Vue

<template>
<demo-section>
<demo-block :title="$t('basicUsage')">
<van-progress :percentage="0" />
<van-progress :percentage="46" />
<van-progress :percentage="100" />
</demo-block>
<demo-block :title="$t('title2')">
<van-progress inactive :percentage="0" />
<van-progress inactive :percentage="46" />
<van-progress inactive :percentage="100" />
</demo-block>
<demo-block :title="$t('title3')">
<van-progress :pivotText="$t('red')" color="#ed5050" :percentage="26" />
<van-progress :pivotText="$t('orange')" color="#f60" :percentage="46" />
<van-progress :pivotText="$t('yellow')" color="#f09000" :percentage="66" />
</demo-block>
</demo-section>
</template>
<script>
export default {
i18n: {
'zh-CN': {
title2: '进度条置灰',
title3: '样式定制'
},
'en-US': {
title2: 'Inactive',
title3: 'Custom Style'
}
}
}
</script>
<style lang="postcss">
.demo-progress {
.van-progress {
margin: 20px 10px;
&:first-of-type {
margin-top: 10px;
}
}
}
</style>