Vue->实现动态改变浏览器标题前言相信有很大一部分同学和都有一种体验，不爱看文档，不喜欢看文章，基本功不够深厚看到也不

前言

相信有很大一部分同学和都有一种体验，不爱看文档，不喜欢看文章，基本功不够深厚看到也不认识，没有关系，今天我来给家普及vue的知识体系篇章-动态改变浏览器标题。
因为vue是单页应用的关系，所以它只有一个index.html入口文件，在实际的项目开发过程中总不能那么多页面用一个标题撒，答案当然不是不能这样玩儿的,话不多说咱们直接开始走流程

第一步

修改部分的配置将原有的export default Router改成const router = new Router({})
在router文件中最底部暴露eexport default router

第二步

在需要配置标题的路由对象中配置每个页面的标题

{
    path: '/',
    name: 'recommend',
    component: recommend,
    meta: { title: '推荐' }
}
复制代码

第三步

使用全局导航钩子赋

router.beforEach((to,from,next) => {
    if (to.meta.title) {
        document.title = to.meta.title
    }
     next()
})

转载：juejin.cn/post/684490…