Promise.all当有一个请求失败时 导致所有后续的处理都停止优化方案 ...

在您的代码中，使用 Promise.all 来处理多个异步请求（这里是获取图片URL）是一个常见且有效的方法。但是，当此中一个请求失败时，Promise.all 会立即拒绝整个Promise数组，导致所有后续的处理都停止。为了优化这一点，您可以使用 Promise.allSettled 来代替 Promise.all，如许即使某个请求失败，其他请求仍然可以继续实行，而且您可以在所有请求完成后处理每个请求的效果（无论成功还是失败）

1. getListAll(params).then(res => {  
2.   const imgPromises = res.data.data.map(item => {  
3.     item.checked = false;  
4.     // 使用 getImgUrl 返回一个Promise，并在Promise中处理成功和失败  
5.     return getImgUrl({ fileId: item.ossPath }).then(url => {  
6.       item.url = url;  
7.       item.status = 'success'; // 标记请求成功  
8.       return item;  
9.     }).catch(error => {  
10.       item.url = null; // 或者设置为错误图片URL  
11.       item.status = 'error'; // 标记请求失败  
12.       item.error = error; // 可选：保存错误信息  
13.       return item;  
14.     });  
15.   });  
16.   
17.   // 使用 Promise.allSettled 而不是 Promise.all  
18.   Promise.allSettled(imgPromises).then(results => {  
19.     // 过滤出所有成功的结果  
20.     const updatedItems = results.map(result => {  
21.       if (result.status === 'fulfilled') {  
22.         return result.value;  
23.       }  
24.       // 如果需要，可以处理失败的请求结果  
25.       // 这里只是简单地将其包含在返回的数组中  
26.       return result.reason; // 注意：这里通常不返回reason，因为reason是错误对象  
27.       // 更好的做法是返回带有错误信息的原item  
28.       return { ...result.reason, status: 'error' };  
29.     }).filter(item => item !== undefined); // 移除因错误而可能返回的undefined  
30.   
31.     imgList.value = updatedItems;  
32.     loading.value = false;  
33.   }).catch(error => {  
34.     // 处理 Promise.allSettled 外的错误（虽然这里不太可能发生）  
35.     console.error('Unexpected error:', error);  
36.     imgList.value = []; // 或者设置为错误状态  
37.     loading.value = false;  
38.   });  
39. });

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。