VUE 向后台傳遞 file數組文件, 后台接收不到

當vue通過post請求向后台同時傳遞多個file文件和數組時，應采用Formdata對象進行循環append文件，切記不可以append file數組，不然后台會收不到文件對象，而普通數組可以通過append數組的形式進行添加，后台是可以接收到的。

 

通過vue做文件上傳的時候，定義了  :file-list = " imgList "

 // 上傳文件列表
      imgList: [],

 通過綁定 upload 的 onchange 事件可以 獲取 需要上傳的文件對象。

// 上傳onchange事件
    choiceFile(file, fileList) {this.imgList.push(file.raw); //file.raw 就是文件對象
    },

注意： 在請求的時候不能直接 append 添加 imgList  ，后台在接收的時候會接收不到，需要Formdata對象進行循環append文件。

    uploadSectionFile() {
　　　　//判斷文件大小是否超過2M
      this.field101BeforeUpload();
      // 根據后台需求數據格式
      const form = new FormData();
      // 文件對象
      for (const item of this.imgList) {
        form.append("file", item);
      }
      // 項目封裝的請求方法，下面做簡單介紹
      imgUpload(form).then((response) => {
        const code = response && parseInt(response.code, 10);
        if (code === 200) {
          // xxx
        } else {
          // xxx
        }
      });
    },