令其在详情页面不显示,在Tabbar点击的页面显示
1.在main.js中使用路由守卫和状态管理
首先在状态管理store/index.js中
export default new Vuex.Store({
state: {
isShow:true
},
mutations: {
changeIsLoading(state,value){
state.isShow=value
}
},
其次在 main.js 中
router.beforeEach(function(to,from,next){
var pathArray = ["home","shops","mypage"]
if(pathArray.indexOf(to.name)==-1){
store.commit("changeIsLoading",false)
}
else{
store.commit("changeIsLoading",true)
}
next()
})
我们将tabbar写在了App.vue中
<!--然后在页面里我们将状态管理里面的isShow得值获取一下,然后判断他是否显示-->
computed:{
...mapState(["isShow"])
}
然后我就能在代码中用它了
<div v-if="$store.state.showtabbar">
···
</div>