vue 每个单页面的标题

因为要开发移动端的网站，需要每个页面都要有标题，怎么操作呢？

有两种方法

首先要在路由里面添加标题

  path: '/useragreement',
  component: resolve => require(['@/page/h5/userAgreement'], resolve),
  meta:{
    title:'用户协议'
  }

第一种方法：
用这个vue-wechat-title插件

    npm install vue-wechat-title --save-dev

在main.js中引入并使用

    import VueWechatTitle from 'vue-wechat-title'
    Vue.use(VueWechatTitle)

在app.vue中修改标签

    <router-view v-wechat-title='$route.meta.title'></router-view>

第二种方法：

在main.js中使用

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

第二种方法必须是通过路由跳转才会有标题，第一种不会有这种情况，移动端的话个人还是比较推荐第一种，希望能对您有所帮助。