前端传list集合,后端接收
一、前端列表多选
<el-table ref="multipleTable" :data="tableData" stripe style="width: 99%;margin-bottom: 10px;" :height="$publicjs.tableHeight" @selection-change="handleSelectionChange" border > <el-table-column type="selection" width="55" /> <el-table-column type="index" label="序号" width="60" /> </el-table>
二、前端方法
一、多选方法
handleSelectionChange(val) {
this.multipleSelection = val;
this.deleteIds=[]
val.forEach(element => {
this.deleteIds.push(element.id)
});
},
二、批量操作
handleSelectedDel(){
let count= this.deleteIds.length
if(count ==0 ){
this.$publicjs.showMessage("请选择!", this.$publicjs.ErrorType)
}else{
deleteData(this.deleteIds).then(res=>{
if (res.code == 200) {
this.$publicjs.showMessage(res.message, this.$publicjs.SuccessType)
this.handleQuery();
} else {
this.$publicjs.showMessage(res.message, this.$publicjs.ErrorType)
}
})
}
},
三、调用方法
export function deleteData(data) {
return request({
url: 'api/item-basic-info/clear',
method: 'post',
data
})
}
三、后端控制器接收
@ApiOperation(value = "清空") @PostMapping(value = "/clear") public Response<String> clearItem(@RequestBody List<String> list){ int re = itemBasicInfoService.clearItem(list); if (re > 0) { return new Response<>(ErrorCode.SUCESS_CODE, "清空成功", re); } else { return new Response<>(ErrorCode.INTERNAL, "清空失败", null); } }