el-popover在表格中使用的坑

el-popover在表格中使用

el-popover是elementUi的一个弹出框，当在表格中循环使用时，每一个el-popover没有指定的标记，因此会失效。

解决办法

<el-popover placement="top" width="160" :ref="'popover-'+scope.$index">
  <p>这是一段内容这是一段内容确定删除吗？</p>
  <div style="text-align: right; margin: 0">
    <el-button size="mini" type="text" @click="closePopover(scope.$index)">取消</el-button>
    <el-button type="primary" size="mini" 
    @click="handleDelete(scope.$index, scope.row);closePopover(scope.$index)">确认</el-button>
  </div>
  <el-button slot="reference" type="danger" size="mini" @click="openPopover(scope.$index)" plain>
    <i class="iconfont icon-delete" style="margin-right: 5px;"></i>删除
  </el-button>
</el-popover>

这里调用doShow()和doClose()的方式调用即可，script代码如下

这里有个问题：一脸懵逼的不懂，doShow和doClose都是方法，不知道为什么一个doShow不加()起作用，doClose加()起作用。如果有不同的情况，可以尝试加或不加()

 //方法集合
    methods: {
    
    
      openPopover(index){
    
    
        //doShow这是一个方法,但是不知道为什么不能加()，否则不起作用
        this.$refs['popover-' + index].doShow;
       
        // this.$refs.index.doShow();
      },
      closePopover(index){
    
    
        //一脸懵逼,doClose居然需要加(),否则不起作用
        this.$refs['popover-' + index].doClose();
      }
    },