Vue ——设置页面title标题

在这里插入图片描述
一个项目中如果每个页面标题都相同的话,直接在index.html中修改title标签里面的标题即可

<title>XXX后台管理</title>

如果项目中的每个页面都展示不同的标题的话,需要进行以下配置

const routes = [
  {
    
    
    path: "/login",
    component: () => import("@/views/login/Index"),
    meta: {
    
    
      public: true,
      title: "用户登录",
    },
  },
  {
    
    
    path: "/user/home",
    component: () => import("@/views/user/Home"),
    meta: {
    
    
      title: "用户中心",
    },
  },
 ]

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

猜你喜欢

转载自blog.csdn.net/Kiruthika/article/details/120716176