Optimize Table's Tooltip mouse effect
This commit is contained in:
parent
cd16f8a5a1
commit
3e3afb1deb
1 changed files with 8 additions and 1 deletions
|
@ -7,7 +7,7 @@
|
||||||
<template v-if="renderType === 'html'"><span v-html="row[column.key]"></span></template>
|
<template v-if="renderType === 'html'"><span v-html="row[column.key]"></span></template>
|
||||||
<template v-if="renderType === 'normal'">
|
<template v-if="renderType === 'normal'">
|
||||||
<template v-if="column.tooltip">
|
<template v-if="column.tooltip">
|
||||||
<Tooltip transfer :content="row[column.key]" :theme="tableRoot.tooltipTheme" :disabled="!showTooltip" :max-width="300" class="ivu-table-cell-tooltip">
|
<Tooltip transfer :content="row[column.key]" :theme="tableRoot.tooltipTheme" :disabled="!showTooltip && !tooltipShow" :max-width="300" class="ivu-table-cell-tooltip" @on-popper-show="handleTooltipShow" @on-popper-hide="handleTooltipHide">
|
||||||
<span ref="content" @mouseenter="handleTooltipIn" @mouseleave="handleTooltipOut" class="ivu-table-cell-tooltip-content">{{ row[column.key] }}</span>
|
<span ref="content" @mouseenter="handleTooltipIn" @mouseleave="handleTooltipOut" class="ivu-table-cell-tooltip-content">{{ row[column.key] }}</span>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</template>
|
</template>
|
||||||
|
@ -62,6 +62,7 @@
|
||||||
uid: -1,
|
uid: -1,
|
||||||
context: this.$parent.$parent.$parent.currentContext,
|
context: this.$parent.$parent.$parent.currentContext,
|
||||||
showTooltip: false, // 鼠标滑过overflow文本时,再检查是否需要显示
|
showTooltip: false, // 鼠标滑过overflow文本时,再检查是否需要显示
|
||||||
|
tooltipShow: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -101,6 +102,12 @@
|
||||||
},
|
},
|
||||||
handleTooltipOut () {
|
handleTooltipOut () {
|
||||||
this.showTooltip = false;
|
this.showTooltip = false;
|
||||||
|
},
|
||||||
|
handleTooltipShow () {
|
||||||
|
this.tooltipShow = true;
|
||||||
|
},
|
||||||
|
handleTooltipHide () {
|
||||||
|
this.tooltipShow = false;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
|
|
Loading…
Add table
Reference in a new issue