在TabBarItem.vue文件中
<template>
<div class="tab-bar-item" @click=itemClick>
<div v-if='!isActive'>
<slot name="item-icon"></slot>
</div>
<div v-else>
<slot name="item-icon-active"></slot>
</div>
<div :class"{active:isActive}"}>
<slot name="item-text"></slot>
</div>
</div>
</template>
<script>
export default {
name:"TabBarItem",
computed:{
isActive(){
return this.$router.path.indexOf(this.path) !== -1
//当不存在当前路径时才会返回-1
}
},
methods:{
this.$router.push(this.path)
}
}
</script>