github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: menu error

pull/3053/head
tangjinzhou 2020-10-25 23:05:29 +08:00
parent ba90214573
commit 0a7065ce89
1 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/vc-menu/MenuItemGroup.jsx
View File

@ -1,11 +1,17 @@
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { getComponent, getSlot } from '../_util/props-util'; import { getComponent, getSlot } from '../_util/props-util';
import { menuAllProps } from './util'; import { menuAllProps } from './util';
import { defineComponent } from 'vue'; import { defineComponent, inject } from 'vue';
import classNames from '../_util/classNames';
const injectExtraPropsKey = 'ANT_MENU_PROVIDER_PROPS_KEY';
const MenuItemGroup = { const MenuItemGroup = {
name: 'MenuItemGroup', name: 'MenuItemGroup',
inheritAttrs: false, inheritAttrs: false,
setup() {
return {
injectExtraProps: inject(injectExtraPropsKey, () => ({})),
};
},
props: { props: {
renderMenuItem: PropTypes.func, renderMenuItem: PropTypes.func,
index: PropTypes.number, index: PropTypes.number,
@ -18,12 +24,12 @@ const MenuItemGroup = {
isMenuItemGroup: true, isMenuItemGroup: true,
methods: { methods: {
renderInnerMenuItem(item) { renderInnerMenuItem(item) {
const { renderMenuItem, index, subMenuKey } = this.$props; const { renderMenuItem, index, subMenuKey } = { ...this.$props, ...this.injectExtraProps };
return renderMenuItem(item, index, subMenuKey); return renderMenuItem(item, index, subMenuKey);
}, },
}, },
render() { render() {
const props = { ...this.$props, ...this.$attrs }; const props = { ...this.$props, ...this.injectExtraProps, ...this.$attrs };
const { class: cls = '', rootPrefixCls, title } = props; const { class: cls = '', rootPrefixCls, title } = props;
const titleClassName = `${rootPrefixCls}-item-group-title`; const titleClassName = `${rootPrefixCls}-item-group-title`;
const listClassName = `${rootPrefixCls}-item-group-list`; const listClassName = `${rootPrefixCls}-item-group-list`;
@ -32,7 +38,7 @@ const MenuItemGroup = {
delete props.onClick; delete props.onClick;
const children = getSlot(this); const children = getSlot(this);
return ( return (
<li {...props} class={`${cls} ${rootPrefixCls}-item-group`}> <li {...props} class={classNames(cls, `${rootPrefixCls}-item-group`)}>
<div class={titleClassName} title={typeof title === 'string' ? title : undefined}> <div class={titleClassName} title={typeof title === 'string' ? title : undefined}>
{getComponent(this, 'title')} {getComponent(this, 'title')}
</div> </div>