布局容器-页面标题
网址:https://router.vuejs.org/zh/guide/advanced/meta
给每一个路由添加 元信息 数据
router/index.ts
const router = createRouter({history: createWebHistory(import.meta.env.BASE_URL),routes: [{ path: '/login', component: () => import('@/views/Login/index.vue'), meta: { title: '登录' } },{path: '/',component: () => import('@/views/Layout/index.vue'),redirect: '/home',children: [{path: '/home',component: () => import('@/views/Home/index.vue'),meta: { title: '首页' }},{path: '/notify',component: () => import('@/views/Notify/index.vue'),meta: { title: '消息通知' }},{path: '/user',component: () => import('@/views/User/index.vue'),meta: { title: '个人中心' }}]}]
})
//后置导航
//切换路由设置标题
router.afterEach((to) => {document.title = `${to.meta.title || ''}-优医问诊`
})
扩展元信息类型 types/vue-router.d.ts
import 'vue-router'
declare module 'vue-router' {// 扩展 元信息类型interface RouteMeta {// 标题title?: string}
}