vue中为每个vue-router跳转的页面设置单独的页面title

一般来说，如果不对vue中新打开的页面进行设置，会默认使用首页的title作为新打开的vue页面title。对vue-router跳转到的页面设置单独的页面title，分为如下2步：

1. 在src中的router的index.js文件中
   
   对需要单独设置页面title的路由，增加meta属性，在meta里面新增页面的title名字属性：
   
   具体代码：

  {
    
    
    path: '/:pathMatch(.*)*',
    component: () => import(/* webpackChunkName: "home" */ '../page/404/404.vue'),
    meta: {
    
    
      title: '找不到页面',
    }
  }

2. 在路由配置的下方，把新增meta的title属性设置为页面title的方法：
   
   具体代码：

router.beforeEach((to, from, next) => {
    
    
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    
    
    document.title = to.meta.title
  }
  next()
})

这样设置以后，就可以实现对vue中为每个vue-router跳转的页面设置单独的页面title了。