fix: menu some class not correct

This commit is contained in:
tangjinzhou 2020-11-10 00:18:32 +08:00
parent c07d1eab41
commit c523266a99
2 changed files with 10 additions and 7 deletions

View File

@ -3,6 +3,7 @@ import { SubMenu as VcSubMenu } from '../vc-menu';
import classNames from '../_util/classNames';
import Omit from 'omit.js';
import { getSlot } from '../_util/props-util';
import { injectExtraPropsKey } from '../vc-menu/FunctionProvider';
export type MenuTheme = 'light' | 'dark';
@ -19,6 +20,7 @@ export default defineComponent({
setup() {
return {
menuPropsContext: inject<MenuContextProps>('menuPropsContext', {}),
injectExtraProps: inject(injectExtraPropsKey, () => ({})),
};
},
methods: {
@ -29,7 +31,7 @@ export default defineComponent({
render() {
const { $slots, $attrs } = this;
const { rootPrefixCls, popupClassName } = this.$props;
const { rootPrefixCls, popupClassName } = {...this.$props, ...this.injectExtraProps} as any;
const { theme: antdMenuTheme } = this.menuPropsContext;
const props = {
...this.$props,

View File

@ -310,9 +310,9 @@ const SubMenu = {
}
},
isChildrenSelected() {
isChildrenSelected(children) {
const ret = { find: false };
loopMenuItemRecursively(getSlot(this), this.$props.selectedKeys, ret);
loopMenuItemRecursively(children, this.$props.selectedKeys, ret);
return ret.find;
},
// isOpen () {
@ -412,10 +412,12 @@ const SubMenu = {
render() {
const props = { ...this.$props, ...this.$attrs };
const { onEvents } = splitAttrs(props);
const { rootPrefixCls, parentMenu } = this;
const { rootPrefixCls } = this;
const isOpen = props.isOpen;
const prefixCls = this.getPrefixCls();
const isInlineMode = props.mode === 'inline';
const childrenTemp = filterEmpty(getSlot(this));
const children = this.renderChildren(childrenTemp);
const className = {
[prefixCls]: true,
[`${prefixCls}-${props.mode}`]: true,
@ -423,7 +425,7 @@ const SubMenu = {
[this.getOpenClassName()]: isOpen,
[this.getActiveClassName()]: props.active || (isOpen && !isInlineMode),
[this.getDisabledClassName()]: props.disabled,
[this.getSelectedClassName()]: this.isChildrenSelected(),
[this.getSelectedClassName()]: this.isChildrenSelected(childrenTemp),
};
if (!this.internalMenuId) {
@ -489,7 +491,6 @@ const SubMenu = {
{icon || <i class={`${prefixCls}-arrow`} />}
</div>
);
const children = this.renderChildren(filterEmpty(getSlot(this)));
const getPopupContainer = this.parentMenu.isRootMenu
? this.parentMenu.getPopupContainer
@ -497,7 +498,7 @@ const SubMenu = {
const popupPlacement = popupPlacementMap[props.mode];
const popupAlign = props.popupOffset ? { offset: props.popupOffset } : {};
let popupClassName = props.mode === 'inline' ? '' : props.popupClassName || '';
popupClassName = `${prefixCls}-popup ${rootPrefixCls}-${parentMenu.theme} ${popupClassName}`;
popupClassName = `${prefixCls}-popup ${rootPrefixCls} ${popupClassName}`;
const liProps = {
...omit(onEvents, ['onClick']),
...mouseEvents,