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

Table: manage tooltip state better, fixed #4044

pull/4210/head
pengchongfu 2017-04-09 00:51:39 +08:00 committed by 杨奕
parent 9be5a40b3f
commit 32543f3671
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/table/src/table-body.js
View File

@ -216,12 +216,17 @@ export default {
tooltip.referenceElm = cell;
tooltip.$refs.popper.style.display = 'none';
tooltip.doDestroy();
tooltip.setExpectedState(true);
this.activateTooltip(tooltip);
}
},
handleCellMouseLeave(event) {
this.$refs.tooltip && this.$refs.tooltip.handleClosePopper();
const tooltip = this.$refs.tooltip;
if (tooltip) {
tooltip.setExpectedState(false);
tooltip.handleClosePopper();
}
const cell = getCell(event);
if (!cell) return;

16
packages/tooltip/src/main.js
View File

@ -58,8 +58,8 @@ export default {
name={ this.transition }
onAfterLeave={ this.doDestroy }>
<div
onMouseleave={ () => { this.debounceClose(); this.togglePreventClose(); } }
onMouseenter= { this.togglePreventClose }
onMouseleave={ () => { this.setExpectedState(false); this.debounceClose(); } }
onMouseenter= { () => { this.setExpectedState(true); } }
ref="popper"
v-show={!this.disabled && this.showPopper}
class={
@ -77,8 +77,8 @@ export default {
const data = vnode.data = vnode.data || {};
const on = vnode.data.on = vnode.data.on || {};
on.mouseenter = this.addEventHandle(on.mouseenter, this.handleShowPopper);
on.mouseleave = this.addEventHandle(on.mouseleave, this.debounceClose);
on.mouseenter = this.addEventHandle(on.mouseenter, () => { this.setExpectedState(true); this.handleShowPopper(); });
on.mouseleave = this.addEventHandle(on.mouseleave, () => { this.setExpectedState(false); this.debounceClose(); });
data.staticClass = this.concatClass(data.staticClass, 'el-tooltip');
return vnode;
@ -99,7 +99,7 @@ export default {
},
handleShowPopper() {
if (this.manual) return;
if (!this.expectedState || this.manual) return;
clearTimeout(this.timeout);
this.timeout = setTimeout(() => {
this.showPopper = true;
@ -107,13 +107,13 @@ export default {
},
handleClosePopper() {
if (this.preventClose || this.manual) return;
if (this.expectedState || this.manual) return;
clearTimeout(this.timeout);
this.showPopper = false;
},
togglePreventClose() {
this.preventClose = !this.preventClose;
setExpectedState(expectedState) {
this.expectedState = expectedState;
}
}
};