由于每个路由页面的title可能都不一样,因此使用document.title来进行动态的改变
1.在定义路由页面的时候,写入title名称
const routes = [ { path: "/home", name: "home", component: () => import("../views/home.vue"), meta: { title: "首页", }, }, ]
2.在main.js中使用路由守卫中的前置守卫(beforeEach)来实现title的动态改变
router.beforeEach(function (to, from, next) { if (to.meta.title) { document.title = to.meta.title; } next(); });