vue-router 中的 meta ,路由元的一个作用。
如:app.vue中
<div id="app">
<topNav v-if="$route.meta.showNav"></topNav >
<router-view />
</div>
在 router 的 index.js 中,路由的配置页面中
Router({
mode: 'history',
routes: [{
path: '/login',
name: 'Login',
component: () => import( /* webpackChunkName: Login */ "../components/login/login.vue"),
meta: {
showNav: false
}
},{
path: '/homepage',
name: 'Homepage',
component: () => import( /* webpackChunkName: Homepage*/ "../components/homepage/homepage.vue"),
meta: {
showNav: true
}
}]
})
app.vue 这样的配置,页面在路由切换的时候,topNav 组件会在加载前去读取 $route.meta.showNav 的值。
页面上也就达到了在登录页面不显示头部导航栏的作用。