fix(projects): 修复vertical-mix导航模式的二级菜单显示问题

This commit is contained in:
Soybean
2021-09-29 08:49:28 +08:00
parent c7e6b86a5b
commit 6f286e6747
10 changed files with 1443 additions and 979 deletions

View File

@ -27,7 +27,6 @@ export default function useReloadContext() {
}
return {
context,
useReloadProvide,
useReloadInject
};

View File

@ -1 +1,3 @@
export { setupAppContext, useReloadInject } from './app';
export { useVerticalMixSiderContext } from './part';

View File

@ -0,0 +1,3 @@
import useVerticalMixSiderContext from './useVerticalMixSiderContext';
export { useVerticalMixSiderContext };

View File

@ -0,0 +1,54 @@
import { ref } from 'vue';
import type { Ref } from 'vue';
import { useContext, useBoolean } from '@/hooks';
interface VerticalMixSiderContext {
/** 子菜单可见性 */
childMenuVisible: Ref<boolean>;
/** 展示子菜单 */
showChildMenu(): void;
/** 隐藏子菜单 */
hideChildMenu(): void;
/** 鼠标悬浮的一级菜单对应的路由名称 */
hoverRouteName: Ref<string>;
/** 设置悬浮路由名称 */
setHoverRouteName(name: string): void;
isMouseEnterChildMenu: Ref<boolean>;
setMouseEnterChildMenu(): void;
setMouseLeaveChildMenu(): void;
}
const { useProvide, useInject: useVerticalMixSiderInject } = useContext<VerticalMixSiderContext>();
export default function useVerticalMixSiderContext() {
const { bool: childMenuVisible, setTrue: showChildMenu, setFalse: hideChildMenu } = useBoolean();
const {
bool: isMouseEnterChildMenu,
setTrue: setMouseEnterChildMenu,
setFalse: setMouseLeaveChildMenu
} = useBoolean();
const hoverRouteName = ref('');
function setHoverRouteName(name: string) {
hoverRouteName.value = name;
}
const context: VerticalMixSiderContext = {
childMenuVisible,
showChildMenu,
hideChildMenu,
hoverRouteName,
setHoverRouteName,
isMouseEnterChildMenu,
setMouseEnterChildMenu,
setMouseLeaveChildMenu
};
function useVerticalMixSiderProvide() {
useProvide(context);
}
return {
useVerticalMixSiderProvide,
useVerticalMixSiderInject
};
}