vue-路由動態切換title


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

喜歡的小伙伴可以關注我的微信公眾號“前端偽大叔”

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM