Vue中如何设置在执行删除等危险操作时给用户提示（二次确认后执行对应的操作）

在项目中、在执行删除等不可撤销操作时，要提示用户。等用户二次确认后、才执行对应的方法。

效果展示

点击删除

等待二次确认

确定删除

删除成功

1、Vue官网

Popconfirm 气泡确认框
点击元素，弹出气泡确认框。

<template>
<el-popconfirm
  title="这是一段内容确定删除吗？"
>
  <el-button slot="reference">删除</el-button>
</el-popconfirm>
</template>

2、项目中的实际应用

<template slot-scope="scope">
                      <el-popconfirm
                        confirm-button-text="好的"
                        cancel-button-text="不用了"
                        icon="el-icon-info"
                        icon-color="red"
                        title="确定删除该商品吗？"
                        @confirm="handleDelete(scope.$index, scope.row)"
                      >
                        <el-button
                          type="danger"
                          icon="el-icon-delete"
                          slot="reference"
                        ></el-button>
                      </el-popconfirm>
                    </template>

3、后语

学无止境。。。。。。