el-table设置fixed=“right“且在th表头使用el-popover 重复显示2个

网上的解决方法都没有直接解决问题

由于element-ui组件对于我们来说是黑盒 很难通过外部干预组件逻辑

所以用简单粗暴的解决方案 如下

1.给popover设置唯一ref；click绑定方法自己写 不要用表达式

 <el-table-column align="left">
   <template slot="header" slot-scope="scope">
     <el-popover
       :ref="'statusSelect' + scope.$index"
       v-model="statusSelectVisible"
       trigger="manual"
     >
       <div slot="reference" @click="openPopover">{{ statusText }}<i class="el-icon-arrow-down el-icon--right"></i></div>
     </el-popover>
    </template>
 </el-table-column>

2.在el-table fixed=right设置生效并渲染后 手动删除复制出的新节点 注意这是只用到一次el-popover的 多个el-popover请独立思考删除逻辑

 this.$nextTick(() => {
   document.querySelector('.el-table__fixed-right .el-popover').remove()
   document.querySelector('.el-table__fixed-right .el-popover__reference').remove()
 })