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('后置钩子')
})

       3.路由独享的守卫

{
    path: '/about',
    component: About,
    meta:{
      title:'关于'
    },
    // 路由独享的守卫      进入路由之前调用
    beforeEnter:(to,from,next)=>{
        console.log('about beforeEnter');
        next();
    }
  },