在vue中實(shí)現(xiàn)給每個(gè)頁面頂部設(shè)置title
實(shí)現(xiàn)思路很簡單:就是利用路由的導(dǎo)購守衛(wèi)beforeEach在每次頁面跳轉(zhuǎn)前更改對應(yīng)的title
1.首先在route里面給每個(gè)路由加上meta屬性
2.在main.js里面加上導(dǎo)航守衛(wèi)
router.beforeEach((to,form,next) => {window.document.title = to.meta.title == undefined?’默認(rèn)標(biāo)題’:to.meta.titlenext()})
補(bǔ)充知識:vue element tab標(biāo)簽頁文本溢出時(shí),鼠標(biāo)上去 Tooltip文字提示
重點(diǎn):el-tooltip標(biāo)簽內(nèi)加slot=“l(fā)abel”
<el-tooltip effect='dark' :content='item.stationName' placement='bottom-start' slot='label'> <span>{{item.stationName}}</span> </el-tooltip>
<div class='left'> <el-tabs tab-position='left' @tab-click='handleClick' > <el-tab-pane v-for='(item,index) in chargingStatusTitle' :key='index'> <el-tooltip effect='dark' :content='item.stationName' placement='bottom-start' slot='label'> <span>{{item.stationName}}</span> </el-tooltip> <div > </div> </el-tab-pane> </el-tabs > </div>
以上這篇在vue中實(shí)現(xiàn)給每個(gè)頁面頂部設(shè)置title就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. CSS可以做的幾個(gè)令你嘆為觀止的實(shí)例分享2. jsp實(shí)現(xiàn)簡單用戶7天內(nèi)免登錄3. 詳解盒子端CSS動畫性能提升4. asp在iis7報(bào)錯(cuò)行號不準(zhǔn)問題的解決方法5. 5個(gè)HTML5的常用本地存儲方式詳解與介紹6. 基于javaweb+jsp實(shí)現(xiàn)學(xué)生宿舍管理系統(tǒng)7. html中的form不提交(排除)某些input 原創(chuàng)8. CSS百分比padding制作圖片自適應(yīng)布局9. 淺談CSS不規(guī)則邊框的生成方案10. ASP中解決“對象關(guān)閉時(shí),不允許操作。”的詭異問題……
