VUE + 小程序 关于前端循环上传附件页面卡死的问题

最开始我使用for循环，后端能正常保存，但是前端页面卡死了，开始代码是这么写的

    wx.showLoading({
              title: '文件上传中...',
              mask: true // 是否显示透明蒙层，防止触摸穿透，默认：false
            });
            const {
              fileList
            } = that.data;
            that.setData({
              "fileResult": []
            });
            console.log("开始处理附件上传");
            for (var file of fileList) {
              uploadFile({
                "folder": "carfj",
                "fjlxdm": "CARFJ",
                "ywid": pkid
              }, file).then(res => {
                console.log("得到上传成功后的数据");
                console.log(res);
                const {
                  fileResult
                } = that.data;
                fileResult.push(res);
                that.setData({
                  "fileResult": fileResult
                });
              });
            }
            console.log("上传结果检查中...");
            while (true) {
              const {
                fileList,
                fileResult
              } = that.data;
              if (fileList.length == fileResult.length) {
                break;
              }
            }
            wx.hideLoading();

你当前的代码存在几个问题，导致前端没有得到上传文件的返回值：

1. 异步操作未等待：你在循环中调用了 ​uploadFile​，但没有等待这些异步操作完成。因此，​while​ 循环会立即执行，而不是等待所有文件上传完成。
2. 无限循环：​while (true)​ 会导致无限循环，这会阻塞主线程，使得小程序无法响应其他事件。
3. 数据更新问题：​setData​ 是异步的，你在循环中更新 ​fileResult​，但这个更新可能不会立即反映在 ​that.data​ 中。

为了解决这些问题，你可以使用 ​Promise.all​ 来等待所有上传操作完成，而不是使用 ​while​ 循环。以下是修改后的代码：

//上传附件
            wx.showLoading({
              title: '文件上传中...',
              mask: true // 是否显示透明蒙层，防止触摸穿透，默认：false
            });
            const {
              fileList
            } = that.data;
            that.setData({
              "fileResult": []
            });
            console.log("开始处理附件上传");
            // 创建一个数组来存储所有的上传 Promise
            const uploadPromises = fileList.map(file => {
              return uploadFile({
                "folder": "carfj",
                "fjlxdm": "CARFJ",
                "ywid": pkid
              }, file).then(res => {
                console.log("得到上传成功后的数据");
                console.log(res);
                const {
                  fileResult
                } = that.data;
                fileResult.push(res);
                that.setData({
                  "fileResult": fileResult
                });
              });
            });
            // 等待所有上传操作完成
            Promise.all(uploadPromises).then(() => {
              wx.hideLoading();
              console.log("所有文件上传完成");


            }).catch(err => {
              console.log("文件上传失败", err);
              wx.showToast({
                title: "文件上传失败",
                icon: 'none',
                mask: true,
              });
              wx.hideLoading();
              return;
            });