[new feature] Tabbar: add active-color prop (#2372)

This commit is contained in:
neverland
2018-12-25 21:41:57 +08:00
committed by GitHub
parent fb9a5fe727
commit 728a0e26c5
6 changed files with 79 additions and 4 deletions
+18 -3
View File
@@ -24,7 +24,7 @@
</van-tabbar>
</demo-block>
<demo-block :title="$t('title2')">
<demo-block :title="$t('customIcon')">
<van-tabbar v-model="active2">
<van-tabbar-item info="3">
<span>{{ $t('custom') }}</span>
@@ -38,6 +38,18 @@
<van-tabbar-item icon="setting-o">{{ $t('tab') }}</van-tabbar-item>
</van-tabbar>
</demo-block>
<demo-block :title="$t('customColor')">
<van-tabbar
v-model="active3"
active-color="#4b0"
>
<van-tabbar-item icon="home-o">{{ $t('tab') }}</van-tabbar-item>
<van-tabbar-item icon="search">{{ $t('tab') }}</van-tabbar-item>
<van-tabbar-item icon="friends-o">{{ $t('tab') }}</van-tabbar-item>
<van-tabbar-item icon="setting-o">{{ $t('tab') }}</van-tabbar-item>
</van-tabbar>
</demo-block>
</demo-section>
</template>
@@ -45,10 +57,12 @@
export default {
i18n: {
'zh-CN': {
title2: '自定义图标'
customIcon: '自定义图标',
customColor: '自定义颜色'
},
'en-US': {
title2: 'Custom icon'
customIcon: 'Custom icon',
customColor: 'Custom Color'
}
},
@@ -56,6 +70,7 @@ export default {
return {
active: 0,
active2: 0,
active3: 0,
icon: {
normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png',
active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png'