table表格中鼠标划过激活Popover弹出框
el-table(:data="tableData", :stripe="true", border)
el-table-column(prop="id", label="活动ID", width="85")
el-table-column(prop="activityName", label="活动名称", width="200")
template(slot-scope="scope")
el-popover(trigger="hover", class="popover", placement="top" )
div(class="popcenter", v-loading="ispopover")
h4 活动详情
p 活动名称:
span {{ }}
p 活动时间:
span {{ }} 至
span {{ }}
p 活动状态:
span {{ }}
div(slot="reference", @mouseenter="enter(scope.row)") {{ scope.row.activityName }}
注: slot="reference"
@mouseenter="enter()" 鼠标划过触发
@mouseleave="leave()"鼠标离开触发
enter(id) {
//this.hoverDisplay = [];
this.ispopover = true;
// 防抖
if (this.timer) {
clearTimeout(this.timer);
}
this.timer = setTimeout(async () => {
console.log(“”);
}, 1000);
}