vue2使用ant-design-vue中的a-upload组件支持多选，并且再上传之前函数里面设置文件类型限制，错误格式文件不要在列表中显示

在Vue 2中使用Ant Design Vue (ant-design-vue) 的 `a-upload` 组件实现多选上传，并在上传前对文件类型进行限制，可以按照以下步骤操作：

1. 首先，安装 Ant Design Vue 相关依赖：

   npm install antd ant-design-vue@latest

2. 在组件模板中引入 `Upload` 组件以及需要的样式：

   <template>
     <a-upload
       :action="uploadUrl"
       :show-file-list="true"
       :multiple="true"
       :before-upload="beforeUpload"
       :filter="filterFileType"
     >
       <a-button slot="trigger">选择文件</a-button>
       <p>{message}</p>
     </a-upload>
   </template>

3. 定义 `uploadUrl`、`beforeUpload` 和 `filterFileType` 方法：

   <script>
   import { Upload } from 'ant-design-vue';

   export default {
     components: {
       Upload,
     },
     data() {
       return {
         uploadUrl: 'your/upload/api', // 你的上传接口地址
         message: '',
         files: [],
       };
     },
     methods: {
       beforeUpload(file) {
         // 检查文件类型是否允许
         const allowedTypes = ['image/jpeg', 'image/png', 'application/pdf']; // 可接受的文件类型数组
         if (!allowedTypes.includes(file.type)) {
           this.message = '只支持上传图片和PDF文件';
           return false;
         }
         // 如果通过类型检查，返回true，允许上传
         return true;
       },
       filterFileType(file) {
         // 这里也可以直接在beforeUpload中过滤，但在处理大量文件时，将过滤逻辑移到单独的函数更清晰
         // 返回true表示允许显示，false表示不允许显示
         return this.beforeUpload(file);
       },
     },
   };
   </script>

4. 当用户取消选择或者上传完成后，你可以更新 `files` 数据来控制显示哪些已选择的文件：

   mounted() {
     // 清空已有文件列表
     this.files = [];
   },
   watch: {
     $data.files(newFiles) {
       // 更新文件列表，只显示通过过滤后的文件
       this.files = newFiles.filter(this.filterFileType);
     },
   },