vux 更改 Tabbar 选中状态

在 vux 的文档和示例中,都没有明确的说明 tabbar 上 v-model 的使用

文档中将v-model说明放在了 TabbarItem 示例下,但是其实这个应该是放在Tabbar

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<template>
<router-view class="view" v-on:changeTab="changeTab"></router-view>
<tabbar v-model="index">
<tabbar-item></tabbar-item>
...
<tabbar-item></tabbar-item>
</tabbar>
</template>
<script>
data(){
return{
index:0,
...
}
}
methods:{
changeTab(num){
...
this.index = num;
...
}
}
</scirpt>

然后子组件中调用

1
2
3
mounted(){
this.$emit('changeTab', 2)
}

这样就便于在不同的组件内都可以更改 Tabbar 选中状态

vux 更改 Tabbar 选中状态

https://hivan.me/vux-tabbar-selected/

作者

Hivan Du

发布于

2021-08-31

更新于

2024-01-16

许可协议

评论