鍍金池/ 問答/HTML/ vue-router改title,改完router-view消失

vue-router改title,改完router-view消失

貼代碼:

想每次進(jìn)一個(gè)路由的時(shí)候,改一下document.title

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

const router = new Router({
  routes: [
    //首頁
    {
      path: '/',
      name: 'index',
      component: () => import('../components/index.vue'),
      meta: {
        title: '首頁'
      }
    },
    //詳情頁
    {
      path: '/detail',
      name: 'Detail',
      component:  () => import('../components/Detail.vue'),
      meta: {
        title: '詳情頁'
      }
    }
  ]
});

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

export default router

去掉router.beforeEach之后,router-view就出現(xiàn)了,然后document.title沒改,
加回router.beforeEach之后,router-view就消失了,然后document.title改了。

回答
編輯回答
墨小羽
2017年9月14日 23:17
編輯回答
不舍棄

謝邀,使用路由守衛(wèi)時(shí),注意執(zhí)行next() 方法

2017年9月11日 12:03
編輯回答
呆萌傻
router.beforeEach((to, from, next) => {
  if(to.meta.title) {
    document.title = to.meta.title;
  }
  next(); // 記得調(diào)用 next
});
2017年8月26日 19:58