vue种动态渲染方式有多种，但是各有个的优缺点，要根据项目来确定使用哪一种。
1、用vue-wechat-title插件
由于做的大多数项目是微信的，所以很多时候直接会想到用vue-wechat-title插件
-
安装插件 npm install vue-wechat-title --save
或者直接在package.json中添加 -
引用 在main.js中引用
-
路由文件中写好title
-
在router-view 中使用
<router-view v-wechat-title="$route.meta.title" />
但是,这个插件有时会有bug,在项目中如果监听路由并存储到本地,会有问题,每次切换、刷新页面的时候都会出现加载多次的情况。
这个错误这篇博客有详细说明 https://blog.csdn.net/SnowBeatRain/article/details/82711964
所以基于这种情况这个实现动态title的方式就不是很完美。
2、利用路由的导购守卫beforeEach在每次页面跳转前更改对应的title
-
路由文件写好title
-
在main.js里面加上导航守卫
但是这个在某些情况下也有缺陷
在app内嵌h5的混合应用中，iOS系统下部分APP的webview中的标题不能通过 document.title = xxx 的方式修改，原因是在IOS webview中网页标题只加载一次，动态改变是无效的。