VUE 单页面应用 修改页面title

首先路由配置：

const routes = [
  {
    path: '/',
    name: 'login',
    component: Login,
    meta: {
      title: '服务记录',  // 添加meta属性
    },
  },
  {
    path: '/fillAddress',
    name: 'fillAddress',
    component: FillAddress,
    meta: {
      title: '填写领取礼品地址',
    },
  },
]

在路由导航中给页面title赋值

router.beforeEach((to, from, next) => {
  if (to.meta?.title) {
    document.title = to.meta.title; // 通过document.title赋值
  }

  // 添加路由导航守卫
  const token = Cookies.get('token') || '';
  if (to.name !== 'login' && token === '') next({ name: 'login' });
  else next();
});