refactor: menu

feat-new-menu
tangjinzhou 2021-05-23 21:31:46 +08:00
parent 08533c772d
commit ad9d635e35
5 changed files with 11 additions and 12 deletions

View File

@ -1,5 +1,5 @@
import { computed, defineComponent, ref, watch } from '@vue/runtime-core'; import { computed, defineComponent, ref, watch } from '@vue/runtime-core';
import Transition from 'ant-design-vue/es/_util/transition'; import Transition from '../../_util/transition';
import { useInjectMenu, MenuContextProvider } from './hooks/useMenuContext'; import { useInjectMenu, MenuContextProvider } from './hooks/useMenuContext';
import SubMenuList from './SubMenuList'; import SubMenuList from './SubMenuList';

View File

@ -11,6 +11,7 @@ import {
reactive, reactive,
onMounted, onMounted,
toRaw, toRaw,
unref,
} from 'vue'; } from 'vue';
import shallowEqual from '../../_util/shallowequal'; import shallowEqual from '../../_util/shallowequal';
import useProvideMenu, { StoreMenuInfo, useProvideFirstLevel } from './hooks/useMenuContext'; import useProvideMenu, { StoreMenuInfo, useProvideFirstLevel } from './hooks/useMenuContext';
@ -23,8 +24,8 @@ import {
MenuInfo, MenuInfo,
SelectInfo, SelectInfo,
} from './interface'; } from './interface';
import devWarning from 'ant-design-vue/es/vc-util/devWarning'; import devWarning from '../../vc-util/devWarning';
import { collapseMotion, CSSMotionProps } from 'ant-design-vue/es/_util/transition'; import { collapseMotion, CSSMotionProps } from '../../_util/transition';
import uniq from 'lodash-es/uniq'; import uniq from 'lodash-es/uniq';
export const menuProps = { export const menuProps = {
@ -67,7 +68,6 @@ export default defineComponent({
computed(() => undefined), computed(() => undefined),
); );
const inlineCollapsed = computed(() => { const inlineCollapsed = computed(() => {
console.log('siderCollapsed.value', siderCollapsed.value);
if (siderCollapsed.value !== undefined) { if (siderCollapsed.value !== undefined) {
return siderCollapsed.value; return siderCollapsed.value;
} }
@ -111,7 +111,7 @@ export default defineComponent({
let subMenuParentEventKeys = []; let subMenuParentEventKeys = [];
(Object.values(toRaw(store)) as any).forEach((menuInfo: StoreMenuInfo) => { (Object.values(toRaw(store)) as any).forEach((menuInfo: StoreMenuInfo) => {
if (mergedSelectedKeys.value.includes(menuInfo.key)) { if (mergedSelectedKeys.value.includes(menuInfo.key)) {
subMenuParentEventKeys.push(...menuInfo.parentEventKeys.value); subMenuParentEventKeys.push(...unref(menuInfo.parentEventKeys));
} }
}); });
@ -275,7 +275,6 @@ export default defineComponent({
} else if (mergedMode.value !== 'inline') { } else if (mergedMode.value !== 'inline') {
// We need find all related popup to close // We need find all related popup to close
const subPathKeys = getChildrenKeys(childrenEventKeys); const subPathKeys = getChildrenKeys(childrenEventKeys);
console.log('subPathKeys', eventKey, childrenEventKeys, subPathKeys);
newOpenKeys = newOpenKeys.filter(k => !subPathKeys.includes(k)); newOpenKeys = newOpenKeys.filter(k => !subPathKeys.includes(k));
} }

View File

@ -10,13 +10,13 @@ import {
} from 'vue'; } from 'vue';
import useProvideKeyPath, { useInjectKeyPath } from './hooks/useKeyPath'; import useProvideKeyPath, { useInjectKeyPath } from './hooks/useKeyPath';
import { useInjectMenu, useProvideFirstLevel, MenuContextProvider } from './hooks/useMenuContext'; import { useInjectMenu, useProvideFirstLevel, MenuContextProvider } from './hooks/useMenuContext';
import { getPropsSlot, isValidElement } from 'ant-design-vue/es/_util/props-util'; import { getPropsSlot, isValidElement } from '../../_util/props-util';
import classNames from 'ant-design-vue/es/_util/classNames'; import classNames from '../../_util/classNames';
import useDirectionStyle from './hooks/useDirectionStyle'; import useDirectionStyle from './hooks/useDirectionStyle';
import PopupTrigger from './PopupTrigger'; import PopupTrigger from './PopupTrigger';
import SubMenuList from './SubMenuList'; import SubMenuList from './SubMenuList';
import InlineSubMenuList from './InlineSubMenuList'; import InlineSubMenuList from './InlineSubMenuList';
import Transition, { getTransitionProps } from 'ant-design-vue/es/_util/transition'; import Transition, { getTransitionProps } from '../../_util/transition';
let indexGuid = 0; let indexGuid = 0;
export default defineComponent({ export default defineComponent({
@ -281,7 +281,7 @@ export default defineComponent({
{titleNode} {titleNode}
{/* Inline mode */} {/* Inline mode */}
{!overflowDisabled.value && mode.value !== 'vertical' && ( {!overflowDisabled.value && (
<InlineSubMenuList id={popupId} open={open.value} keyPath={keysPath.value}> <InlineSubMenuList id={popupId} open={open.value} keyPath={keysPath.value}>
{slots.default?.()} {slots.default?.()}
</InlineSubMenuList> </InlineSubMenuList>

View File

@ -1,4 +1,4 @@
import { Key } from 'ant-design-vue/es/_util/type'; import { Key } from '../../_util/type';
export type MenuTheme = 'light' | 'dark'; export type MenuTheme = 'light' | 'dark';

2
v2-doc

@ -1 +1 @@
Subproject commit a7013ae87f69dcbcf547f4b023255b8a7a775557 Subproject commit d197053285b81e77718621c0b5b94cb3b21831a2