vue公共组件裁减导航,
场景：有一个公共头部和底部，vue搭建的框架，在app.vue里写的公共方法，首页是个登录页面，不需要公共部分，在这基础上进行公共部分的显示隐藏。
即注册页、登录页、404页面都不要导航
公共代码写在vue.app里面。主要用到的是：
<template>
<div v-show="zs">
······
//这个里面也有路由的占位，后面那个主要是在避免注册页面显示空白的问题
<div>
</template>
<!-- 路由占位符 -->
<router-view> </router-view>
<!-- 内容区域结束 -->
<script lang='ts'>
export default {
data() {
return {
zs:false //这个地方要先设置一个状态
}
},
computed: {
greeting() {
return this.message + '!'
}
},
watch:{
$route(to,from){
if (to.path=='/login') {
this.zs=false;
}else{
this.zs=true;
}
}
},
mounted() {
this.path = this.$route.path;//当前路由
if(this.$route.path == '/login'){
this.zs = false;
}
}
}
</script>
页:
[1]