溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“Vue跳轉頁面怎么隱藏底部導航tabbar”的相關知識，小編通過實際案例向大家展示操作過程，操作方法簡單快捷，實用性強，希望這篇“Vue跳轉頁面怎么隱藏底部導航tabbar”文章能幫助大家解決問題。
在一個頁面中如果有想隱藏部分，可以寫在對應路由的meta里面
如果底部需要隱藏tabbar就設置meta:{hideTabBar:true}
不需要的就設置meta:{hideTabBar:false}
例如這種導航欄：
登錄后復制meta:{
hideTabBar:true
}
然后在app.vue中的tabbar組件(就是底部配置的router-link)中判斷就行
這樣下面的tabbar就不會顯示了
給你跳轉后的那個頁面(即你想要隱藏tabber的頁面)
給它的高度設為100vh,是整個頁面的高度
但是因為tabber用過定位，所以這里不起作用
所以我們可以給設置個相對定位，讓city的作用效果大于tabber，這是z-index起的作用，值設高一點
補充額外知識：
position默認的作用沒有z-index,所以這里用相對定位
overflow-y:auto;滾動條只在y軸滾動
vh：css3新單位，view height的簡寫，是指可視窗口的高度。假如高度是1200px的話。那10vh就是120px
.city {
position: relative;
z-index: 9;
height: 100vh;
background-color: #fff;
overflow-y: auto;
}
但是無論跳轉到哪個頁面，我們都是需要隱藏tabbar的，所以我們可以給它抽離出去
抽離到css文件里面
想用的時候給對應的頁面添加上就OK了
關于“Vue跳轉頁面怎么隱藏底部導航tabbar”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識，可以關注億速云行業資訊頻道，小編每天都會為大家更新不同的知識點。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
