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

在Vue2中，`element-ui`库里的`el-upload`组件是一个常用的文件上传组件，如果你想实现在选择多个文件并上传前进行文件类型的限制，你可以这样做：

首先，安装依赖：

npm install element-ui

然后，在Vue组件中引入`Upload`组件和需要的样式：

<template>
  <div>
    <el-upload
      ref="upload"
      :action="uploadUrl"
      :multiple="true" <!-- 设置支持多选 -->
      :filter="fileFilter" <!-- 自定义过滤函数 -->
      :on-error="handleError"
      :before-upload="beforeUpload"
      list-type="picture-card"
    >
      <i class="el-icon-upload"></i> 选择文件
    </el-upload>
    <ul v-if="files.length > 0">
      <li v-for="(item, index) in files" :key="index">
        {{ item.name }} ({{ item.size / 1024 | formatSize }} KB)
      </li>
    </ul>
  </div>
</template>

<script>
import { Upload } from 'element-ui';
import { formatSize } from './utils'; // 导入自定义的文件大小格式化工具

export default {
  components: {
    Upload,
  },
  data() {
    return {
      uploadUrl: 'your/upload/url', // 你的上传地址
      files: [], // 存放已选择的文件信息
    };
  },
  methods: {
    fileFilter(file) {
      const allowedTypes = ['image/jpeg', 'image/png']; // 可接受的文件类型数组
      if (!allowedTypes.includes(file.type)) {
        this.$message.error('只允许上传图片文件！');
        return false; // 返回false阻止上传
      }
      return true;
    },
    beforeUpload(file) {
      return this.fileFilter(file);
    },
    handleError(err, file) {
      console.log('Upload error:', err);
    },
  },
};
</script>

在这个例子中，`fileFilter`函数会在用户选择文件之后立即运行，如果文件类型不在指定的允许范围内，就返回`false`阻止上传。同时，`beforeUpload`钩子用于包装`fileFilter`，确保在服务器端验证之前也进行类型检查。