<template>
<div style="height:50px;">
<van-tabbar
v-model="active"
style="background: #032E4D"
>
<van-tabbar-item icon="wap-home" to="/Home" >首页</van-tabbar-item>
<van-tabbar-item icon="orders-o" to="/indent" >订单</van-tabbar-item>
<van-tabbar-item icon="setting-o" to="" @click.native="donot">设置</van-tabbar-item>
<!-- <van-tabbar-item icon="contact" to="/user/index">我的</van-tabbar-item> -->
</van-tabbar>
</div>
</template>
<script>
import { Tabbar, TabbarItem } from "vant";
export default {
data() {
return {
active: '0'
}
},
name:'navigate',
components:{
[Tabbar.name]: Tabbar,
[TabbarItem.name]: TabbarItem,
},
created(){
this.upactive();
},
updated(){
this.upactive()
},
methods:{
upactive(){
this.nowPath=this.$route.path;
//vue提供的方法
if(this.nowPath=="/Home"){
this.active=0
}else if(this.nowPath=="/indent"||this.nowPath=="/detail"||this.nowPath=="/todo"){
this.active=1
}else if(this.nowPath=="/setup"){
this.active=2
}
},
donot(){
alert("暂未开放")
}
},
}
</script>