在vue中实现给每个页面顶部设置title

实现思路很简单:就是利用路由的导购守卫beforeEach在每次页面跳转前更改对应的title

1.首先在route里面给每个路由加上meta属性

在vue中实现给每个页面顶部设置title_第1张图片

2.在main.js里面加上导航守卫

router.beforeEach((to,form,next) => {
window.document.title = to.meta.title == undefined?'默认标题':to.meta.title
next()
})

补充知识:vue element tab标签页文本溢出时,鼠标上去 Tooltip文字提示

重点:el-tooltip标签内加slot=“label”


      {{item.stationName}}
     
{{item.stationName}}

在vue中实现给每个页面顶部设置title_第2张图片

以上这篇在vue中实现给每个页面顶部设置title就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

你可能感兴趣的:(在vue中实现给每个页面顶部设置title)