mirror of
https://github.com/WeBankFinTech/fes.js.git
synced 2025-04-06 03:59:53 +08:00
feat: 手动切换当前路由,菜单也会自动展开
This commit is contained in:
parent
86f5504c11
commit
6b48e89e90
@ -12,7 +12,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { computed, h, ref } from 'vue';
|
||||
import { computed, h, ref, watch } from 'vue';
|
||||
import { FMenu } from '@fesjs/fes-design';
|
||||
import { useRoute, useRouter } from '@@/core/coreExports';
|
||||
import { transform as transformByAccess } from '../helpers/pluginAccess';
|
||||
@ -94,23 +94,34 @@ export default {
|
||||
}
|
||||
return matchMenus[0].path;
|
||||
});
|
||||
const getDefaultExpandMenu = () => {
|
||||
let index = menuArray.value.findIndex((item) => item.value === activePath.value);
|
||||
if (index === -1) {
|
||||
return props.expandedKeys;
|
||||
}
|
||||
const activeMenu = menuArray.value[index];
|
||||
const arr = [activeMenu];
|
||||
while (index > 0) {
|
||||
index = index - 1;
|
||||
const lastMenu = menuArray.value[index];
|
||||
if (lastMenu.children && lastMenu.children.indexOf(arr[arr.length - 1]) !== -1) {
|
||||
arr.push(lastMenu);
|
||||
|
||||
const expandedKeysRef = ref(props.expandedKeys);
|
||||
|
||||
watch(
|
||||
[menuArray, activePath],
|
||||
() => {
|
||||
let index = menuArray.value.findIndex((item) => item.value === activePath.value);
|
||||
if (index === -1) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
return props.expandedKeys.concat(arr.map((item) => item.value));
|
||||
};
|
||||
const expandedKeysRef = ref(getDefaultExpandMenu());
|
||||
const activeMenu = menuArray.value[index];
|
||||
const arr = [activeMenu];
|
||||
while (index > 0) {
|
||||
index = index - 1;
|
||||
const lastMenu = menuArray.value[index];
|
||||
if (lastMenu.children && lastMenu.children.indexOf(arr[arr.length - 1]) !== -1) {
|
||||
arr.push(lastMenu);
|
||||
}
|
||||
}
|
||||
expandedKeysRef.value = expandedKeysRef.value.concat(
|
||||
arr.filter((item) => !expandedKeysRef.value.includes(item.value)).map((item) => item.value),
|
||||
);
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
},
|
||||
);
|
||||
|
||||
const onMenuClick = (e) => {
|
||||
const path = e.value;
|
||||
if (/^https?:\/\//.test(path)) {
|
||||
@ -121,6 +132,7 @@ export default {
|
||||
console.warn('[plugin-layout]: 菜单的path只能使以http(s)开头的网址或者路由地址');
|
||||
}
|
||||
};
|
||||
|
||||
return {
|
||||
activePath,
|
||||
expandedKeysRef,
|
||||
|
Loading…
x
Reference in New Issue
Block a user