vue 页面设置title

Posted mengfangui

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 页面设置title相关的知识,希望对你有一定的参考价值。

1、路由设置meta,meta中设置title

{
    path: ‘/‘,
    name: ‘home‘,
    component: Home,
    meta: {
      // 页面标题title
      title: ‘标题‘
    }
  }

 

2、路由前置守卫设置

mian.js中设置前置路由守卫。

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

 

以上是关于vue 页面设置title的主要内容,如果未能解决你的问题,请参考以下文章

vue 页面设置title

vue设置路由title,实现在vue路由发生变化的时候,相应的页面title随之变化

前端VUE页面快速生成

Vue 设置每个页面的头部对应 title

vue动态给网站每个页面添加title 关键词 描述方法

vue的tab页面title显示问题(title值设置及一闪而过)