Vue-router changed to title, and router-view disappeared.

paste code:

I want to change document.title every time I enter a route

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

after router.beforeEach is removed, router-view appears, and then document.title does not change. After
is added back to router.beforeEach, router-view disappears and document.title changes.

Apr.11,2021

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

next ()

ide/advanced/navigation-guards.html-sharp%E5%85%A8%E5%B1%80%E5%AE%88%E5%8D%AB" rel=" nofollow noreferrer "> https://router.vuejs.org/zh/g.


Thank you for inviting. When using routing guards, pay attention to executing the next () method

Menu