Vue.js项目中管理每个页面的头部标签的两种方法

routes: [
  { /* （首页）默认路由地址 */
    path: '/',
    name: 'Entrance',
    component: Entrance,
    meta: {
      title: '首页入口'
    }
  },
  { /* 修改昵称 */
    path: '/modifyName/:nickName',
    name: 'modifyName',
    component: modifyName,
    meta: {
      title: '修改昵称'
    }
  }
]

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

export default {
 data() {
  return {
   myTitle: '标题'
  }
 },
 metaInfo: {
  title: this.title,
  titleTemplate: '%s - by - vue-meta',
  htmlAttris: {
   lang: 'zh'
  },
  script: ''
 }
 ... ...
}