如何更改vue的每个页面的标题

2019-11-07  本文已影响0人  shine大臣

一:在配置路由的时候加上 meta 属性 ,并且添加 title

{
    path: '/',
    redirect: '/mes',
    meta: {
      index: 0,
      title: '首页',
      requiredAuth: true, //设置导航守卫时需要添加meta
    },
}

2:在路由导航守卫中给每一个页面动态添加 title

router.beforeEach((to, from, next) => {
  if (to.meta.title) {
    document.title = to.meta.title
  }
  next();
})

//下面是登录
if (to.matched.some(route => route.meta.requiredAuth)) {
    // next()
    const token = localStorage.getItem('token')
    if (token) {
      next() //登录之后到达菜单页
    } else {
      next('Login') //没有登陆到达登录页
    }
  } else {
    next()
}
上一篇 下一篇

猜你喜欢

热点阅读