vue的tab页面title显示问题(title值设置及一闪而过)

通常默认情况下,vue-cli脚手架自动生成的项目中,页面title取的是package.json中的name值:

如果我们的项目只是一个单页面,那么直接修改这个值就好

但是!!!
如果我们的项目是一个由vue-router模拟的多页面项目,每个页面都需要设置自己不同的title时,该怎么办呢?
这时候,我们就要拿出路由中的导航卫士功能:
https://router.vuejs.org/zh/guide/advanced/navigation-guards.html#%E5%AF%BC%E8%88%AA%E5%AE%88%E5%8D%AB

我们可以使用 router.beforeEach 注册一个全局前置守卫：

再在路由配置中设置每个路由的title值:

这样当访问所有路由时,会先判断前置守卫中的title值,若存在,则把默认title修改成路由中设置的值
但是!!!
发现如果网路慢,会导致package.json中设置的name一闪而过,强迫症绝对不能忍,可以加一个else判断:

然后将index.html中title标签删除就好:

这样当访问路由,如果路由有设置title,则显示其值,否则显示else中设置的默认值,就酱!

https://www.cnblogs.com/karthuslorin/p/11000431.html