本文主要是介绍vue 导航栏选择性加载，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
转自:https://www.cnblogs.com/jialun-Online/p/11022784.html
亲测有用。
最近写vue项目遇到一些问题,我把导航栏组件放在了app.vue中,让他在每个页面都能显示了,但遇到了一个问题,在登录以及注册页面导航栏是不合理不允许存在的
解决方法:
公共模块的内容可以放在App.vue中
但是通常登录页面是不需要导航的，那么就需要规避登录页
这时，就可以采用keep-alive结合 r o u t e . m e t a 来 实 现 这 个 功 能 。 k e e p − a l i v e 是 V u e 内 置 的 一 个 组 件 ， 可 以 使 被 包 含 的 组 件 保 留 状 态 ， 或 避 免 重 新 渲 染 。 route.meta来实现这个功能。 keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。 route.meta来实现这个功能。keep−alive是Vue内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。route.meta则可以选择让需要的页面才展示。修改App.vue，如下：
复制代码
然后配置路由里面的参数
复制代码
export default new Router({
routes: [
{
path: ‘/’,
name: ‘home’,
component: Home,
meta:{
keepAlive:true//导航栏在该页面显示
}
},
{
path: ‘/login’,
name: ‘login’,
component: Login,
meta:{
keepAlive:false//导航栏在该页面不予显示
}
},
]
}]
谢谢~
这篇关于vue 导航栏选择性加载的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
