点击删除表格中的行并提交到数据库

Posted 2021-02-15 benbenbai

html中：

<el-table-column prop="operation" label="操作" width="170">
  <template slot-scope="scope"> 
    <el-button size="small" type="danger" @click="deleteRow(scope.$index,scope.row)">删除</el-button>
  </template>
</el-table-column>

data中：

myId:‘‘,

methods中：

deleteRow(index,row){
    this.$confirm(‘此操作将永久删除该文件, 是否继续?‘, ‘提示‘, {
      confirmButtonText: ‘确定‘,
      cancelButtonText: ‘取消‘,
      type: ‘warning‘
    }).then(() => {
      this.myId=this.measureTable[index].partDesignSizeId;   //this.measureTable为表格   partDesignSizeId为每个行的特殊id号

      //删除ajax
      this.$ajax({
              method: ‘get‘,
              url: ‘/manage/measure/delete/design/size/by/id‘,
              params:{
                partDesignSizeId:  this.myId,
              },
      }).then((response) =>{
            var resData = response.data;
            if (resData.success) {
              this.$message({
                type: ‘success‘,
                message: ‘删除工艺成功！‘
              });
              this.measureTable.splice(index,1)
            } else {
              alert(resData.message);
            }
      })
    }).catch(() => {
      this.$message({
        type: ‘info‘,
        message: ‘已取消删除‘
      });
    });
  },