前端 H5 :底部工具栏的高亮
This commit is contained in:
parent
a019ac275d
commit
42b11e377e
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div style="height:50px;">
|
||||
<van-tabbar >
|
||||
<van-tabbar v-model="active">
|
||||
<van-tabbar-item icon="wap-home" to="/home">首页</van-tabbar-item>
|
||||
<van-tabbar-item icon="wap-nav" to="/category" >分类</van-tabbar-item>
|
||||
<van-tabbar-item icon="cart" to="/cart" >购物车</van-tabbar-item>
|
||||
@ -16,6 +16,29 @@ export default {
|
||||
components:{
|
||||
[Tabbar.name]: Tabbar,
|
||||
[TabbarItem.name]: TabbarItem,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
// TODO 芋艿,可能不太优雅
|
||||
let path = this.$route.path;
|
||||
switch (path) {
|
||||
case '/home':
|
||||
this.active = 0;
|
||||
break;
|
||||
case '/category':
|
||||
this.active = 1;
|
||||
break;
|
||||
case '/cart':
|
||||
this.active = 2;
|
||||
break;
|
||||
case '/user/index':
|
||||
this.active = 3;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
Loading…
Reference in New Issue
Block a user