vue 路由meta 設(shè)置title 導(dǎo)航隱藏，具體代碼如下所示：

router.js

routes: [{ path: ’/’, name: ’HelloWorld’, component: HelloWorld, meta: {title: 'HelloWorld', 要現(xiàn)實的titleshow: true設(shè)置導(dǎo)航隱藏顯示 } }]

App.vue

<template> <div id='app'> <router-view></router-view> <bottom v-show='this.$route.meta.show'></bottom> this.$route.meta.show 顯示或隱藏 </div> </template>

main.js

router.beforeEach((to, from, next) => { if (to.meta.title) { document.title = to.meta.title } next()})<br><br>監(jiān)聽路由 寫入 title

PS：vue 中路由meta

meta字段（元數(shù)據(jù)）

直接在路由配置的時候，給每個路由添加一個自定義的meta對象，在meta對象中可以設(shè)置一些狀態(tài)，來進(jìn)行一些操作。用它來做登錄校驗再合適不過了

{ path: ’/actile’, name: ’Actile’, component: Actile, meta: { login_require: false },},{ path: ’/goodslist’, name: ’goodslist’, component: Goodslist, meta: { login_require: true }, children:[ { path: ’online’, component: GoodslistOnline } ]}

這里我們只需要判斷item下面的meta對象中的login_require是不是true，就可以做一些限制了

router.beforeEach((to, from, next) => { if (to.matched.some(function (item) { return item.meta.login_require })) { next(’/login’) } else next()})

總結(jié)

到此這篇關(guān)于vue 路由meta 設(shè)置導(dǎo)航隱藏與顯示功能的示例代碼的文章就介紹到這了,更多相關(guān)vue 路由meta 設(shè)置導(dǎo)航隱藏與顯示內(nèi)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！