Vue单独修改某个界面的title

**

为每一个界面设置title 即使用vue-router设置每个页面的title

**
使用vue-router设置每个页面的title：步骤如下

• 进入 router 文件夹底下的index.js文件 引入：

import Vue from 'vue'
import Router from 'vue-router'

• 然后在路由里面写路由的时候配置每个路由的地址 meta中 title：

 routes: [
    {          /* （首页）默认路由地址 */
      path: '/',
      name: 'Entrance',
      component: Entrance,
      meta: {
        title: '首页入口'
      }
    }
    ]

• 在main.js 界面中引入

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

完工！这样，每个界面现实的标题就是路有种title里面的字体；

以上是正常标题的写法，那么现在问题来了 ，如果项目中有一个界面要用该页面的返回数据作为标题，该怎么破呢？

在created或mounted 里添加 document.title=‘标题’即可

（1）pc 端完全可以 ，木有问题；
（2）移动端及微信里面的 会有问题；显示不出来 未修改！然后用下面方法解决：

在created中放入以下代码，如果设置的标题是该页面后台接口返回的数据，即放在得到数据之后！

document.title = '设置标题HTTP';  
        const iframe = document.createElement('iframe');  
        iframe.style.cssText = 'display: none; width: 0; height: 0;';  
        iframe.src = 'http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/05/0F/ChMkJ1erCriIJ_opAAY8rSwt72wAAUU6gMmHKwABjzF444.jpg';  
        //iframe.src = require('./img/text_delete.png');  
  
        const listener = () => {  
            setTimeout(() => {  
                iframe.removeEventListener('load', listener);  
                setTimeout(() => {  
                    document.body.removeChild(iframe);  
                }, 0);  
            }, 0);  
        };  
        iframe.addEventListener('load', listener);  
        document.body.appendChild(iframe); 

完事，大功告成！