面包屑

src/layout/component/Header.vue

@@ -198,7 +198,7 @@ const goBack=()=>{
       <!-- 面包屑 -->
       <div class="flex-col-center left-breadcrumb-box">
         <img @click="goBack" class="back-icon" src="@/assets/icon-back.png" alt="" v-if="$route.meta.hasBack">
-        <span class="breadcrumb-item">研报</span>
+        <span class="breadcrumb-item" v-for="item in $store.state.breadCrumbList" :key="item.path">{{item.name}}</span>
       </div>
     </div>
   </div>

src/router/index.js

@@ -122,6 +122,7 @@ router.beforeEach((to, from, next) => {
 		store.commit('getToken', to.query.token)
     store.dispatch('getUserInfo')
 	}
+  store.commit('setBreadCrumb', to)
   document.title=to.meta.title
 	next();
 })

src/store/index.js

@@ -2,6 +2,7 @@ import { createStore } from "vuex";
 import {ElMessage} from 'element-plus'
 import {apiUserInfo} from '@/api/user.js'
 const token=localStorage.getItem('token')||''
+const breadcrumb=sessionStorage.getItem('breadcrumb')?JSON.parse(sessionStorage.getItem('breadcrumb')):[]
 export default createStore({
   state: {
     globalImgUrls:{//图片配置资源
@@ -28,7 +29,7 @@ export default createStore({
       type:'',// 会议、报名
     },
 
-    breadCrumbList:[],//面包屑数据
+    breadCrumbList:breadcrumb,//面包屑数据
   },
   mutations: {
     // 获取token
@@ -94,7 +95,30 @@ export default createStore({
 
     // 设置面包屑数据
     setBreadCrumb(state,data){
-      
+      // 如果是侧边栏 清除路由栈
+      if (data.meta.isRoot) {
+        let obj = {
+          name: data.matched[0].meta.title,
+          path:''
+        }
+        state.breadCrumbList=[obj]
+      }else{
+        //判断路由栈中是否包含当前路由
+        let index = -1
+        state.breadCrumbList.forEach((item,e) => {
+          if(item.path === data.fullPath){
+            index=e
+          }
+        });
+        if (index==-1) {
+          state.breadCrumbList.push({name:data.meta.title,path:data.fullPath})
+        }else{
+          const arr=state.breadCrumbList.slice(0,index+1)
+          state.breadCrumbList=arr
+        }
+      }
+
+      sessionStorage.setItem('breadcrumb',JSON.stringify(state.breadCrumbList))
     }
 
   },