vue-admin-template-master 删除功能

删除功能需要弹出确认框

1、html部分

<el-table-column label="操作" width="200" align="center">
        <template slot-scope="scope">
          <el-button type="danger" size="mini" icon="el-icon-delete" @click="removeDataById(scope.row.id)">删除</el-button>
        </template>
</el-table-column>

2、脚本部分

teacher.js

import request from '@/utils/request'

export default{
    removeTeacherById(id){
        return request({
            url:`/eduservice/teacher/${id}`,
            method:'delete',
        })
    }
}

页面脚本部分

removeDataById(id){
    this.$confirm('此操作将永久删除该讲师, 是否继续?', '提示', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
       type: 'warning'})
       .then(() => { //点击确定，执行then方法
           //调用删除的方法
           teacher.removeTeacherById(id)
          .then(response=>{    //删除成功，弹出信息提示，重新渲染页面
              this.$message({
              type: 'success',
              message: '删除成功!'
           });
              //刷新渲染页面
            this.getList();
          })
        });
}