首页 > 其他 > 详细

vue-路由动态切换title

时间:2019-10-20 13:30:06      阅读:63      评论:0      收藏:0      [点我收藏+]

router.js

 {
      path: /nav,
      component: () => import(../view/nav.vue),
      meta:{
        title:nav,
      }
    },
    {
      path: /haha,
      component: () => import(../view/haha.vue),
      meta:{
        title:haha
      }
    }

main.js中

router.beforeEach((to, from, next) => {
  /* 路由发生变化修改页面meta */
  if(to.meta.content){
    let head = document.getElementsByTagName(head);
    let meta = document.createElement(meta);
    meta.content = to.meta.content;
    head[0].appendChild(meta)
  }
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  next()
});

ok

喜欢的小伙伴可以关注我的微信公众号“前端伪大叔”

技术分享图片

 

vue-路由动态切换title

原文:https://www.cnblogs.com/qdwds/p/11706948.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!