1.思路
（1）使用vuex存儲當(dāng)前激活的路由activeTabsPath<Srting>以及存儲已訪問的路由showTabs<Arrar>姑荷，
（2）使用element-plus的tabs和menu組件配合vue-router來切換頁面赊抖。
（3）el-menu組件中有一個(gè)default-active的屬性表示默認(rèn)激活菜單的 index，用它來綁定
:default-active="activeTabsPath"振劳，這里需要先把el-menu組件的router屬性設(shè)置為true（表示以index為路徑進(jìn)行跳轉(zhuǎn)），el-menu-item的index屬性綁定為路由路徑（如：index="/home"）
? ? ? ? ?el-tabs組件中用v-model屬性綁定激活的標(biāo)簽冰单，用它來綁定v-model="activeTabsPath"岸军。
? ? ? ? ? 組件中綁定的activeTabsPath為組件的計(jì)算屬性，從vuex中接的activeTabsPath數(shù)據(jù)备典。
（4）給el-menu-item和el-tab-pane添加點(diǎn)擊事件异旧，el-menu-item點(diǎn)擊后以綁定的index更新vuex中的activeTabsPath，同時(shí)push一個(gè)對象（包含el-menu-item的name和index）到vuex的showTabs中（需判斷是否與showTabs中的重復(fù)）提佣。el-tab-pane點(diǎn)擊后用router.push跳轉(zhuǎn)吮蛹，同時(shí)更新vuex中的activeTabsPath荤崇。
（5）tabs欄中的標(biāo)簽用vuex的showTabs來循環(huán)渲染，到此可實(shí)現(xiàn)點(diǎn)擊菜單欄跳轉(zhuǎn)頁面潮针，同時(shí)在tabs欄中新增一個(gè)標(biāo)簽术荤，點(diǎn)擊標(biāo)簽跳轉(zhuǎn)到已訪問的頁面，激活標(biāo)簽與激活菜單對應(yīng)然低。
（6）在el-tab-pane中有個(gè)tab-remove刪除標(biāo)簽事件喜每，刪除標(biāo)簽后，需同時(shí)刪除vuex的showTabs中對應(yīng)的對象雳攘。這里還可以多兩個(gè)情況带兜，刪除激活標(biāo)簽和標(biāo)簽數(shù)量限制以及最后一個(gè)標(biāo)簽，分別對應(yīng)的是跳轉(zhuǎn)最后一個(gè)標(biāo)簽吨灭，超出后刪除前排標(biāo)簽刚照，以及不允許刪除或跳轉(zhuǎn)首頁。
（7）為實(shí)現(xiàn)刷新后也能保存tabs欄喧兄，需在更新vuex數(shù)據(jù)的同時(shí)上傳到sessionStorage中无畔，在刷新頁面時(shí)去sessionStorage中獲取activeTabsPath以及showTabs，上傳對象需用JSON.parse()處理下載以及JSON.stringif()處理上傳吠冤。
（8）已訪問頁面數(shù)據(jù)的緩存尚未實(shí)現(xiàn)浑彰，再探索中。
? ??????
