vue.js 底部導(dǎo)航欄 一級(jí)路由顯示 子路由不顯示的解決方法
最近利用vue第三方UI MuseUI開發(fā)webapp,然后在導(dǎo)航欄這里出現(xiàn)了問題,我需要在導(dǎo)航欄上的幾個(gè)路由上顯示底部導(dǎo)航欄,在其他路由上不顯示,就這個(gè)問題,MuseUI的底部導(dǎo)航欄直接加載在app.vue里面,會(huì)每個(gè)頁(yè)面都有導(dǎo)航欄,所以這種方式不可行,后來我真的使出了渾身解數(shù),去MuseUI作者GitHub上面提問,無果,去segmentfault上面提問,無果,去vue官方群提問,無果,在提問之前,我都是經(jīng)過一番搜索,思考的,但是這些都讓我崩潰了??赡艹鲥e(cuò)的地方從路由URL,museUI的使用BUG,到加入鉤子函數(shù),都預(yù)想過,都不是,沒關(guān)系,堅(jiān)持就是勝利,可能是我的努力感動(dòng)了上蒼,找到了解決方案。
router.js
const router = new VueRouter({
mode: 'history',
routes: [
{ path: '/first', component: firstView, meta: { navShow: true, cname: '一級(jí)頁(yè)面' }, name: 'first' },
{ path: '/sub', component: subView, meta: { navShow: false, cname: '子頁(yè)面' }, name: 'sub' },
],
});
app.vue
<Bar v-show="$route.meta.navShow">
這是我找到的解決方案,之后根據(jù)這個(gè)修改了自己的代碼,成功解決了。
以上這篇vue.js 底部導(dǎo)航欄 一級(jí)路由顯示 子路由不顯示的解決方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue+element+electron仿微信實(shí)現(xiàn)代碼
這篇文章主要介紹了vue+element+electron仿微信實(shí)現(xiàn),本文通過示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-12-12
如何處理vue router 路由傳參刷新頁(yè)面參數(shù)丟失
這篇文章主要介紹了如何處理vue router 路由傳參刷新頁(yè)面參數(shù)丟失,對(duì)vue感興趣的同學(xué),可以參考下2021-05-05
卸載vue2.0并升級(jí)vue_cli3.0的實(shí)例講解
在本篇文章里小編給大家整理的是關(guān)于卸載vue2.0并升級(jí)vue_cli3.0的實(shí)例內(nèi)容,需要的朋友們可以學(xué)習(xí)參考下。2020-02-02
vue跳轉(zhuǎn)頁(yè)簽傳參并查詢參數(shù)的保姆級(jí)教程
這篇文章主要介紹了vue跳轉(zhuǎn)頁(yè)簽傳參并查詢參數(shù)的保姆級(jí)教程,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-04-04
vue element el-form 多級(jí)嵌套驗(yàn)證的實(shí)現(xiàn)示例
本文主要介紹了vue element el-form 多級(jí)嵌套驗(yàn)證的實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08

