vue动态改变title

一般写title会在index.html里的head标签title元素里面写

可以根据路由写title

首先要安装

cnpm install vue-wechat-title --save

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home,
      meta:{
        keepAlive:true,
        title:'团体终身重大疾病保险'
      }
    },
    {
      path: '/customOrder',
      name: 'customOrder',
      component: customOrder,
      meta:{
        title:'订单中心'
      }
    },
})

main.js里面的代码:

router.beforeEach((to, from, next) => {
  /* 路由发生变化修改页面meta */
  if(to.meta.content){
    let head = document.getElementsByTagName('head');
    let meta = document.createElement('meta');
    meta.content = to.meta.content;
    head[0].appendChild(meta)
  }
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  next()
});

在首页最外层的div里写

v-wechat-title="$route.meta.title"

在customOrder里面也要写,每个页面都写

还可以在页面里面进行判断然后给title赋值

例子(简单的例子,可以写个方法进行判断,然后赋值):

    jumpDetails(index,itemson){
      console.log(this.$route.meta.title+index,itemson)
    }