el-upload批量手动上传，并用form表单校验上传文件

手动上传设置:auto-upload="false"

 
          
            
              选择文件
              
jpg/png/jfif
            
          
        

        

data() {
    return {
      // 上传参数
      addModel: false,
      formData: {
        fileList: [],
      },
      rules: {
        fileList: [
          { required: true, message: "请上传数据", trigger: "change" },
        ],
      },
      errorMsg: null, // 业务编码校验提示语
    }
  },

// 确认上传
    async confirmInfo() {
      // 整体表单校验
      this.$refs.formData.validate(async (valid) => {
        if (!valid) {
          return false;
        }
        this.confirmLoading = true;
        let pathUrl = [],i=0;
        for (let list of this.formData.fileList) {
          let targetRoute = `file/${list?.name}`;
          await putFile(targetRoute, list.raw);
          // 第一次上传oss的时候延迟5ms，用于oss上传函数请求成功并获得返回值，防止循环请求oss token获取函数
          if (i == 0) await this.delay(500);
          pathUrl.push(targetRoute);
          i++;
        }
        //此处写请求函数
        await this.$rquest.aaa()
      });
    },
    // 延迟函数
    async delay(ms) {
      return new Promise((resolve) => {
        setTimeout(resolve, ms);
      });
    },
    // 上传之前校验
    handleChange(file, fileList) {
      let fileName = file.name.substring(file.name.lastIndexOf(".") + 1);
      let typeInfo = ["jpg", "jpeg", "png", "jfif"];
      fileName = fileName.toLowerCase();
      if (!typeInfo.includes(fileName)) {
        this.$message({
          type: "warning",
          message: "请上传jpg/png/jfif格式的图片",
        });
        // 过滤掉不符合条件的文件
        this.formData.fileList = this.formData.fileList.filter(
          (list) => list.uid != file.uid
        );
        return false;
      }
      // 存储符合条件的所有fileList数据
      this.formData.fileList = fileList; // 存储上传的文件
    },
    handleRemove(file, fileList) {
      // 执行移除方法的时候重新更新数据
      this.formData.fileList = fileList;
      console.log(file, fileList);
    },
    handlePreview(file) {
      console.log(file);
    },