设置页面标题title

由于每个路由页面的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();
});