添加一个批量删除按钮， multipleSelection.length === 0用来判断是否点击选择，如果没有选中任意一项，那么批量删除按钮不可点击，选择数据之后，才可以进行数据的批量删除
<el-button
type="danger"
icon="el-icon-delete"
@click="delAll"
:disabled="multipleSelection.length === 0"
style="margin-left:15px;" >
批量删除
</el-button>想要获取不同页的数据进行操作，利用reserve-selection，需要注意的是使用reserve-selection属性必须配合row-key（不然会报错）?
<el-table
tooltip-effect="dark"
style="width: 100%"
v-loading="listLoading"
:data="datalist"
@selection-change="handleSelectionChange" //多选，当选择项发生变化时会触发该事件
@row-click="handleRowClick" //点击每行时触发事件
ref="handSelectTest_multipleTable" //添加属性
row-key="id">
//手动添加一个el-table-column，设type属性为selection即可
<el-table-column
type = 'selection'
label="全选"
width="55"
:reserve-selection="true"> //选择其他页时，之前页选的的框依然存在
</el-table-column>
</el-table>在方法中添加点击复选框、点击行和根据id批量删除的方法
methods:{
handleSelectionChange(val) {
console.log(val) //打印选中的行集合
this.multipleSelection = val;
},
//点击行触发，选中或不选中复选框
handleRowClick(row, column, event) {
this.$refs.handSelectTest_multipleTable.toggleRowSelection(row);
console.log(row) //打印的时当前选中的行
},
// 批量删除
async delAll(){
var arr=[]
//遍历点击选择的对象集合，拿到每一个对象的id添加到新的集合中
this.multipleSelection.forEach(row=>arr.push(row._id))
console.log(this.multipleSelection);
arr.forEach(item=>{
this.http.delete(`del/${item}`)
})
} ,
}后端接口代码
// 删除数据
router.delete('/del/:_id',async (req,res)=>{
// console.log(req.params.id);
var r=await user.deleteOne({_id:req.params._id}).exec()
console.log(r);
res.json({code:200})
})
