26.利用路由导航守卫改变页面的title
1.router下的index.js页面配置映射规则中为每一个路由添加meta元数据设置title名字
{
path: '/about',
component: About,
meta:{
title:'关于'
}
},
2.在index.js文件中添加路由导航守卫
1.前置守卫
to:即将要进入目标的路由对象
from:当前导航即将要离开的路由对象
next:调用该方法后,才能进入下一个钩子
// 前置守卫(guard)
router.beforeEach((to,from,next)=>{
//从from到to
console.log(to);
document.title= to.matched[0].meta.title;
next(); //页面跳转
})
2.后置钩子
router.afterEach((to,from)=>{
console.log('后置钩子')
})
{
path: '/about',
component: About,
meta:{
title:'关于'
},
// 路由独享的守卫 进入路由之前调用
beforeEnter:(to,from,next)=>{
console.log('about beforeEnter');
next();
}
},