最近利用 vue 第三方 UI MuseUI 开发 webapp, 然后在导航栏这里出现了问题, 我需要在导航栏上的几个路由上显示底部导航栏, 在其他路由上不显示, 就这个问题, MuseUI 的底部导航栏直接加载在 app.vue 里面, 会每个页面都有导航栏, 所以这种方式不可行, 后来我真的使出了浑身解数, 去 MuseUI 作者 GitHub 上面提问, 无果, 去 segmentfault 上面提问, 无果, 去 vue 官方群提问, 无果, 在提问之前, 我都是经过一番搜索, 思考的, 但是这些都让我崩溃了可能出错的地方从路由 URL,museUI 的使用 BUG, 到加入钩子函数, 都预想过, 都不是, 没关系, 坚持就是胜利, 可能是我的努力感动了上苍, 找到了解决方案
- router.js
- const router = new VueRouter({
- mode: 'history',
- routes: [{ path: '/first', component: firstView, meta: { navShow: true, cname: '一级页面'}, name: 'first' },
- { path: '/sub', component: subView, meta: { navShow: false, cname: '子页面' }, name: 'sub' },
- ],
- });
- app.vue
- <Bar v-show="$route.meta.navShow">
这是我找到的解决方案, 之后根据这个修改了自己的代码, 成功解决了
以上这篇 vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法就是小编分享给大家的全部内容了, 希望能给大家一个参考, 也希望大家多多支持脚本之家
来源: http://www.jb51.net/article/136130.htm