• 微信
您当前的位置: 首页> Vue>

vue设置网页页面title--router

作者:Alpha时间:2020-12-23 阅读数:3440 +人阅读

新建的vue项目默认情况下页面标题就是项目文件夹的名称,显然这是不合适的,我们可以通过router来处理vue新建项目页面没有标题的情况。

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页面设置操作。

本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。

如果侵犯了你的权益请来信告知我们删除。邮箱:595397166@qq.com

标签: 小程序

阿尔法

软件开发工程师#全栈工程师

{include file=foot.html}