element ui 中 Popconfirm 气泡确认框的使用

[vue]element ui 中 Popconfirm 气泡确认框的使用

最近发现element ui中的el-popconfirm组件在el-table中使用很是方便。
官方文档链接 https://element.eleme.io/#/zh-CN/component/popconfirm

注意：最好将vue和element UI的版本升级至最新，旧版本可能不支持

在el-table-column中添加

<template slot-scope="scope">
      <el-popconfirm title="确定从列表中移除吗？"
                   @confirm="handleDeleteRow(scope.$index, scope.row)">
                   <el-button slot="reference" type="text" v-show="!scope.row.load" style="color:#909399">
                   <i class="el-icon-delete"></i>
                   </el-button>
      </el-popconfirm>
</template>

效果如图

还可以调整按钮文字等，具体可以查看官方文档。