使用vue-router設定每個頁面的title
阿新 • • 發佈:2019-01-27
const router = new Router({
routes: [
{
path: '/',
name: 'EntryConfirmation',
meta: { title: "到崗候選人名單確認" },
component: EntryConfirmation
}
]
})
router.beforeEach((to, from, next) => {
if (to.meta.title) {//如果設定標題,攔截後設置標題
document.title = to.meta.title
}
next()
})
export default router
每個守衛方法接收三個引數:
to: Route: 即將要進入的目標 路由物件
from: Route: 當前導航正要離開的路由
next: Function: 一定要呼叫該方法來 resolve 這個鉤子。執行效果依賴 next 方法的呼叫引數。
next(): 進行管道中的下一個鉤子。如果全部鉤子執行完了,則導航的狀態就是 confirmed (確認的)。
next(false): 中斷當前的導航。如果瀏覽器的 URL 改變了 (可能是使用者手動或者瀏覽器後退按鈕),那麼 URL 地址會重置到 from 路由對應的地址。
next(‘/’) 或者 next({ path: ‘/’ }): 跳轉到一個不同的地址。當前的導航被中斷,然後進行一個新的導航。你可以向 next 傳遞任意位置物件,且允許設定諸如 replace: true、name: ‘home’ 之類的選項以及任何用在 router-link 的 to prop 或 router.push 中的選項。
next(error): (2.4.0+) 如果傳入 next 的引數是一個 Error 例項,則導航會被終止且該錯誤會被傳遞給 router.onError() 註冊過的回撥。
確保要呼叫 next 方法,否則鉤子就不會被 resolved。