学习项目-前端-第七课：ElementUI: delete

一、easy-mock-->/api/gathering/{gatheringId}(delete)

{
  "code": 20000,
  "flag": true,
  "message": "删除成功！"
}

二、vueadmin-template-master-->src-->api-->gathering.js

import request from "@/utils/request"
const group_name = 'api'
const api_name = 'gathering'


export default {
    getList() {
        return request(
            {
                url: `/${group_name}/${api_name}`,
                method: "get"
            }
        );
    },
    search(page, size, searchMap) {
        return request(
            {
                url: `/${group_name}/${api_name}/search/${page}/${size}`,
                method: "post",
                data: searchMap
            }
        );
    },
    save(pojo){
        return request({
            url : `/${group_name}/${api_name}`,
            method : 'post',
            data : pojo
        });
    },
    findById(id){
        return request({
            url : `/${group_name}/${api_name}/${id}`,
            method : 'get'
        });
    },
    update(id,pojo){
        if(id == null || id == ''){
            return this.save(pojo);
        }
        return request({
            url : `/${group_name}/${api_name}/${id}`,
            method : 'put',
            data : pojo
        });
    },
    deleteById(id){
        return request({
            url : `/${group_name}/${api_name}/${id}`,
            method : 'delete'
        });
    }
}

三、vueadmin-template-master-->src-->views-->table-->gathering.vue(handleDelete)

 <el-table-column
        fixed="right"
        label="操作"
        width="120">
        <template slot-scope="scope">
          <el-button @click="handleEdit(scope.row.id)" type="text" size="small">修改</el-button>
          <el-button @click="handleDelete(scope.row.id)" type="text" size="small">删除</el-button>
        </template>
      </el-table-column>

handleDelete(id){

      this.$confirm('确定要删除此记录吗?', 'Warning', {

          confirmButtonText: 'OK',

          cancelButtonText: 'Cancel',

          type: 'warning'

        }).then(() => {

          gatheringApi.deleteById(id).then(response=>{

            this.$message({

              message: response.message,

              type: (response.flag?'success':'error')

            });

            if(response.flag){

              this.fetchData();

            }

          });

        }).catch(() => {

        });

      

    }