element-ui的表格popover操作的显示/隐藏

Question

点击删除按钮后弹出popover确认框，点击取消后怎么隐藏popover
https://jsfiddle.net/d1qtfo6L/

Answer 1

https://segmentfault.com/q/10...
在这个问题中有一个简单粗暴的方法，我认为比官方提供的方式更友好。
使用document.querySelector("#app").click();的方式模拟点击

Answer 2

页面代码：

<el-table-column label="操作">
  <template scope="scope">
    <el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
    <el-popover ref="popover{{$index}}" placement="right" v-model="scope.row.visible2">
      <p>这是一段内容这是一段内容确定删除吗？</p>
      <div style="text-align: right; margin: 0">
        <el-button size="mini" type="text" @click="scope.row.visible2 = false">取消</el-button>
        <el-button type="primary" size="mini" @click="scope.row.visible2 = false">确定</el-button>
      </div>
    </el-popover>
    <el-button size="small" type="danger" v-popover:popover{{$index}}>删除</el-button>
  </template>
</el-table-column>

tableData 加visible2参数

{
  date: '2016-05-02',
  name: '王小虎',
  address: '上海市普陀区金沙江路 1518 弄',
  visible2: false
}

Answer 3

在table里直接引入popover 可能会导致多个row都有popover对象，且绑定值引用到同一个对象。可以封装一个button，在封装的button里写个popover逻辑。
我改了下不再table中引入popover时的关闭poover， 你看看。 希望有帮助。
https://jsfiddle.net/d1qtfo6L...