vue 路由meta 設置title 導航隱藏，具體代碼如下所示：

router.js

routes: [{ path: ’/’, name: ’HelloWorld’, component: HelloWorld, meta: {title: 'HelloWorld', 要現實的titleshow: true設置導航隱藏顯示 } }]

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>監聽路由 寫入 title

PS：vue 中路由meta

meta字段（元數據）

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

{ 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()})

總結

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