bugfix: 刷新后保持当前页面&左侧导航选中

src/views/Administrator.vue

@@ -67,7 +67,7 @@
 <script lang="ts">
 import { LoadingOutlined } from "@ant-design/icons-vue";
 import { message, Upload } from "ant-design-vue";
-import { defineComponent, onMounted, h, ref, nextTick, computed,reactive, toRefs, onBeforeMount } from "vue";
+import { defineComponent, onMounted, h, ref, nextTick, computed,reactive, toRefs, onBeforeMount, watch } from "vue";
 import { MailOutlined, AppstoreOutlined, SettingOutlined } from '@ant-design/icons-vue';
 import { Https } from "@/tool/https";
 import { useStore } from "vuex";
@@ -102,11 +102,38 @@ export default defineComponent({
 				// 5,7
 			rootSubmenuKeys: [],
 			openKeys: [],
-			selectedKeys: ['sub1'],
+			selectedKeys: [],
 			nowPageName:'All User',//当前页面名称
 		});
 		let routers:any = ref([])
 
+		const syncMenuStatus = (path:string)=>{
+			if(!state.rootSubmenuKeys.length)return
+			let matched = false
+			state.rootSubmenuKeys.some((item:any)=>{
+				if(item.children){
+					const target = item.children.find((child:any)=>child.route === path)
+					if(target){
+						state.selectedKeys = [target.key]
+						state.openKeys = [`sub-${item.key}`]
+						state.nowPageName = target.name
+						matched = true
+						return true
+					}
+				}else if(item.route === path){
+					state.selectedKeys = [`item-${item.key}`]
+					state.openKeys = []
+					state.nowPageName = item.name
+					matched = true
+					return true
+				}
+				return false
+			})
+			if(!matched){
+				state.selectedKeys = []
+			}
+		}
+
 
 		const onOpenChange = (openKeys: string[]) => {
 			const latestOpenKey:any = openKeys.find(key => state.openKeys.indexOf(key) === -1);
@@ -150,24 +177,12 @@ export default defineComponent({
 				state.rootSubmenuKeys = adminRouter.all(t);
 			}
 			const route = router.currentRoute.value
-			const isMenuRoute = state.rootSubmenuKeys.some((item:any) => item.route === route.path)
+			const isMenuRoute = state.rootSubmenuKeys.some((item:any) => item.route === route.path || item.children?.some((child:any)=>child.route === route.path))
 			// 如果是管理员首页或未匹配菜单，才重定向到首个菜单；否则保持当前路由，避免刷新回到 allUser
 			if (route.path === "/administrator" || !isMenuRoute) {
 				router.push(state.rootSubmenuKeys[0].route)
 			}
-			// state.rootSubmenuKeys.forEach((item:any) => {
-			// 	if(item.children){
-			// 		item.children.forEach((item:any) => {
-			// 			if(item.route == router.currentRoute.value.path){
-			// 				state.selectedKeys[0] = item.key
-			// 			}
-			// 		});
-			// 	}else{
-			// 		if(item.route == router.currentRoute.value.path){
-			// 			state.selectedKeys[0] = item.key
-			// 		}
-			// 	}
-			// });
+			syncMenuStatus(router.currentRoute.value.path)
 			//储存所有用户id和name
 			Https.axiosGet(Https.httpUrls.getAllUserId,).then((rv: any) => {
 				if (rv) {
@@ -192,8 +207,11 @@ export default defineComponent({
 			// router.push(state.rootSubmenuKeys[0].route)
             
         })
+		watch(()=>router.currentRoute.value.path,(path)=>{
+			syncMenuStatus(path)
+		},{immediate:true})
 			onBeforeMount(()=>{
-			state.selectedKeys = ['sub1']
+			state.selectedKeys = []
 		})
 		return {
 			...toRefs(state),