直接使用popover弹出框的时候,是没有任何问题的,但是在el-table中使用popover弹出框就会出现,点击取消按钮,popover框不会隐藏,即使使用v-model绑定值,也是不管用的
解决方法如下
1.在el-popover中添加属性::ref="popover-${scope.$index}
"
2.取消按钮添加点击事件,添加scope参数
<el-table-column
label="操作">
<template slot-scope="scope">
<el-popover
placement="top"
:ref="`popover-${scope.$index}`">
<p>是否已经回访完毕?</p>
<div style="text-align: right; margin: 0">
<el-button
size="mini"
type="text"
@click="cancelBtn(scope)">
取消
</el-button>
</div>
<el-button slot="reference">回访</el-button>
</el-popover>
</template>
</el-table-column>
3.methods方法中调用doClose():scope._self. r e f s [ ‘ p o p o v e r − refs[`popover- refs[‘popover−{scope.$index}`].doClose()
cancelBtn (scope) {
scope._self.$refs[`popover-${scope.$index}`].doClose()
}