blackteay/ray-template
1
0
Fork 0
mirror of https://github.com/XiaoDaiGua-Ray/ray-template.git synced 2025-04-06 03:57:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

修复路由变化不触发菜单状态更新问题

Browse Source
This commit is contained in:
chuan_wuhao 2022-11-24 16:18:13 +08:00
parent b23991a0ee
commit c2029d0fd8
2 changed files with 33 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/production-dist/index.html vendored
View File

@ -5,7 +5,7 @@
<link rel="icon" type="image/svg+xml" href="/ray.svg" /> <link rel="icon" type="image/svg+xml" href="/ray.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ray template</title> <title>ray template</title>
<script type="module" crossorigin src="/assets/index.6bb471d8.js"></script> <script type="module" crossorigin src="/assets/index.f568b427.js"></script>
<link rel="stylesheet" href="/assets/index.4a9527dd.css"> <link rel="stylesheet" href="/assets/index.4a9527dd.css">
</head> </head>
<body> <body>

32
src/store/modules/menu.ts
View File

@ -7,6 +7,7 @@ import type { RouteRecordRaw } from 'vue-router'
export const useMenu = defineStore('menu', () => { export const useMenu = defineStore('menu', () => {
const router = useRouter() const router = useRouter()
const route = useRoute()
const { t } = useI18n() const { t } = useI18n()
const cacheMenuKey = const cacheMenuKey =
@ -47,6 +48,30 @@ export const useMenu = defineStore('menu', () => {
setCache('menuKey', key) setCache('menuKey', key)
} }
/**
*
* @param path 路由地址
*
* 监听路由地址变化更新菜单状态
*/
const updateMenuKeyWhenRouteUpdate = (path: string) => {
const matchMenuItem = (options: MenuOption[]) => {
for (const i of options) {
if (i?.children?.length) {
matchMenuItem(i.children)
}
if (path === i.path) {
menuModelValueChange(i.path, i)
break
}
}
}
matchMenuItem(menuState.options)
}
/** /**
* *
* 获取菜单列表 * 获取菜单列表
@ -108,6 +133,13 @@ export const useMenu = defineStore('menu', () => {
const spliceMenTagOptions = (idx: number) => const spliceMenTagOptions = (idx: number) =>
menuState.menuTagOptions.splice(idx, 1) menuState.menuTagOptions.splice(idx, 1)
watch(
() => route.fullPath,
(newData) => {
updateMenuKeyWhenRouteUpdate(newData)
},
)
return { return {
...toRefs(menuState), ...toRefs(menuState),
menuModelValueChange, menuModelValueChange,