springboot+mybatisplus+vue实现批量删除

要实现批量删除，可以按照以下步骤进行：

1. 前端页面中，勾选需要删除的数据，点击“删除”按钮，将所选数据的id封装成一个数组，通过axios发送到后端。

2. 后端接收前端传来的id数组，根据id数组中的id，从数据库中删除对应数据。

3. 在SpringBoot中，可以使用@DeleteMapping注解来接收前端发送的DELETE请求，并在方法体中实现删除操作。在MyBatisPlus中，可以使用wrapper进行批量删除操作。

4. 最后，后端返回删除结果给前端。

下面是一个简单的代码示例：

前端代码：

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column type="selection"></el-table-column>
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="age" label="年龄"></el-table-column>
      <el-table-column prop="gender" label="性别"></el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">
          <el-button type="danger" size="mini" @click="handleDelete(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-button type="danger" @click="batchDelete">批量删除</el-button>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      tableData: [], // 表格数据
      multipleSelection: [], // 多选数组
    };
  },
  methods: {
    // 删除单条数据
    handleDelete(id) {
      axios.delete('/api/delete/' + id).then((res) => {
        this.getTableData();
      });
    },
    // 批量删除
    batchDelete() {
      const ids = this.multipleSelection.map((item) => item.id);
      axios.delete('/api/batchDelete', {
        data: ids,
      }).then((res) => {
        this.getTableData();
        this.multipleSelection = [];
      });
    },
    // 获取表格数据
    getTableData() {
      axios.get('/api/getTableData').then((res) => {
        this.tableData = res.data;
      });
    },
  },
  created() {
    this.getTableData();
  },
};
</script>

后端代码：

@RestController
@RequestMapping("/api")
public class UserController {

  @Autowired
  private UserService userService;

  // 删除单条数据
  @DeleteMapping("/delete/{id}")
  public boolean delete(@PathVariable("id") Long id) {
    return userService.removeById(id);
  }

  // 批量删除
  @DeleteMapping("/batchDelete")
  public boolean batchDelete(@RequestBody List<Long> ids) {
    return userService.removeByIds(ids);
  }
}