github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Submenu: fix prop append-to-body . #16289

pull/16481/head
Cr 2019-07-09 17:20:23 +08:00 committed by Zhi Cun
parent e152a1033d
commit 6f51ad81fb
1 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
packages/menu/src/submenu.vue
View File

@ -196,8 +196,12 @@
this.timeout = setTimeout(() => { this.timeout = setTimeout(() => {
this.rootMenu.openMenu(this.index, this.indexPath); this.rootMenu.openMenu(this.index, this.indexPath);
}, showTimeout); }, showTimeout);
if (this.appendToBody) {
this.$parent.$el.dispatchEvent(new MouseEvent('mouseenter'));
}
}, },
handleMouseleave() { handleMouseleave(deepDispatch = false) {
const {rootMenu} = this; const {rootMenu} = this;
if ( if (
(rootMenu.menuTrigger === 'click' && rootMenu.mode === 'horizontal') || (rootMenu.menuTrigger === 'click' && rootMenu.mode === 'horizontal') ||
@ -208,11 +212,14 @@
this.dispatch('ElSubmenu', 'mouse-leave-child'); this.dispatch('ElSubmenu', 'mouse-leave-child');
clearTimeout(this.timeout); clearTimeout(this.timeout);
this.timeout = setTimeout(() => { this.timeout = setTimeout(() => {
if (this.appendToBody) {
this.rootMenu.openedMenus = [];
}
!this.mouseInChild && this.rootMenu.closeMenu(this.index); !this.mouseInChild && this.rootMenu.closeMenu(this.index);
}, this.hideTimeout); }, this.hideTimeout);
if (this.appendToBody && deepDispatch) {
if (this.$parent.$options.name === 'ElSubmenu') {
this.$parent.handleMouseleave(true);
}
}
}, },
handleTitleMouseenter() { handleTitleMouseenter() {
if (this.mode === 'horizontal' && !this.rootMenu.backgroundColor) return; if (this.mode === 'horizontal' && !this.rootMenu.backgroundColor) return;
@ -279,7 +286,7 @@
v-show={opened} v-show={opened}
class={[`el-menu--${mode}`, popperClass]} class={[`el-menu--${mode}`, popperClass]}
on-mouseenter={($event) => this.handleMouseenter($event, 100)} on-mouseenter={($event) => this.handleMouseenter($event, 100)}
on-mouseleave={this.handleMouseleave} on-mouseleave={() => this.handleMouseleave(true)}
on-focus={($event) => this.handleMouseenter($event, 100)}> on-focus={($event) => this.handleMouseenter($event, 100)}>
<ul <ul
role="menu" role="menu"
@ -320,7 +327,7 @@
aria-haspopup="true" aria-haspopup="true"
aria-expanded={opened} aria-expanded={opened}
on-mouseenter={this.handleMouseenter} on-mouseenter={this.handleMouseenter}
on-mouseleave={this.handleMouseleave} on-mouseleave={() => this.handleMouseleave(false)}
on-focus={this.handleMouseenter} on-focus={this.handleMouseenter}
> >
<div <div