Vue动态修改页面title

首先在router/index.js里给每个对象定义meta

{
    path:'',
    redirect:'/home'
  },
  {
    path:'/home',
    component:Home,
    meta:{
      title:'首页'
    }
  },
  {
    path:'/cate',
    component:Cate,
    meta:{
      title:'菜单'
    }
  },
  {
    path:'/Shopcart',
    component:Shopcart,
    meta:{
      title:'购物车'
    }
  },
  {
    path:'/Profile',
    component:Profile,
    meta:{
      title:'我的'
    }
  }

第二步在mainjs里写一个箭头函数

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