ant design vue 多文件上传列表删除

Ant Design Vue 中的多文件上传功能通常通过 `Upload` 组件配合 `Upload.List` 实现。要实现多文件上传列表的删除功能，你可以按照以下步骤操作：

1. 首先，在你的组件中导入需要的 Ant Design Vue 文件上传相关的模块：

import { Upload, UploadList } from 'ant-design-vue';

2. 设置 `Upload` 组件的配置，包括允许选择多个文件、设置请求接口等，并监听 `onRemove` 事件，该事件会在用户删除文件时触发：

<template>
  <div>
    <Upload
      action="your-upload-url"
      multiple
      list-type="text"
      on-remove="handleRemove"
    >
      <Button type="dashed">点击选择文件</Button>
    </Upload>
    <Upload.List
      :file-list="listFiles"
      @on-change="handleChange"
    ></Upload.List>
  </div>
</template>

<script>
export default {
  data() {
    return {
      listFiles: [], // 存储已选文件信息
    };
  },
  methods: {
    handleRemove(file) {
      this.listFiles = this.listFiles.filter(item => item.fileId !== file.id);
      // 在这里可以发送请求到服务器删除选定文件
    },
    handleChange(info) {
      if (info.file.status === 'done') {
        const fileList = info.file.response || [];
        this.listFiles.push(...fileList);
      }
    },
  },
};
</script>

在这个例子中，`handleRemove` 方法会从 `listFiles` 数组中移除指定的文件，并可以根据需求同步更新服务器状态。`handleChange` 方法用于处理上传成功的文件并将其添加到 `listFiles`。