亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Axios POST 請求在使用 Promise.all 時返回空數組

Axios POST 請求在使用 Promise.all 時返回空數組

慕尼黑5688855 2023-05-11 14:16:12
使用. requests_Promise.all我在這里做錯了什么,因為我認為使用axios post方法會返回一個承諾?  const doUpload = async (fileList: FileList) => {    const requests: Array<void | AxiosResponse<any>> = [];    Array.from(fileList).forEach(async file => {      const formData = new FormData();      const blob = new Blob([file]);      formData.append(file.name, blob);      requests.push(        await axios          .post(            'https://jsonplaceholder.typicode.com/posts',            {              ...formData,            },            {              headers: {                'Content-Type': 'multipart/form-data',              },              onUploadProgress: (progressEvent: ProgressEvent) =>                handleUploadProgress(progressEvent, file.lastModified),            }          )          .catch(error => {            handleUploadError(file.lastModified);          })      );    });    try {      const data = await Promise.all(requests);      console.dir(data);    } catch (error) {      console.log(error);    }  };
查看完整描述

2 回答

?
青春有我

TA貢獻1784條經驗 獲得超8個贊

Jeremy 是對的,您await的代碼中有不必要的 s,但主要問題是您通過將catch處理程序放在 promise from 上post然后讓該處理程序完成而不拋出錯誤或返回任何內容來隱藏 promise 拒絕。這將拒絕變成了價值的實現undefined。


刪除catch處理程序(可能)或讓它返回一些你可以用來知道post失敗的東西。


FWIW,這是一個執行上述操作并使用 的Array.from映射功能的示例(因為您正在進行映射操作);看評論:


const doUpload = async (fileList: FileList) => {

? // Use `map`

? const requests = Array.from(fileList, file => {

? ? const formData = new FormData();

? ? const blob = new Blob([file]);

? ? formData.append(file.name, blob);


? ? // No need for `await` here

? ? return axios.post(

? ? ? 'https://jsonplaceholder.typicode.com/posts',

? ? ? {

? ? ? ? ...formData,

? ? ? },

? ? ? {

? ? ? ? headers: {

? ? ? ? ? 'Content-Type': 'multipart/form-data',

? ? ? ? },

? ? ? ? onUploadProgress: (progressEvent: ProgressEvent) =>

? ? ? ? ? handleUploadProgress(progressEvent, file.lastModified),

? ? ? }

? ? );

? ? // No `.catch` here (or have one, but make it return something useful

? });


? try {

? ? const data = await Promise.all(requests);

? ? console.dir(data);

? } catch (error) {

? ? console.log(error);

? }

};

如果你需要handleUploadError在那里的某個地方打電話,你可能會考慮使用Promise.allSettled(相對較新的)而不是Promise.all然后調用它來為它給你的數組中的任何被拒絕的承諾。


...當使用 Promise.all 解析時。

只是一個旁注:使用Promise.all不會“解決”您傳遞給它的承諾。它只是觀察他們發生了什么。Promise.all承諾會解決,但無論您使用與否,它們都會解決。

一些可能有用的承諾術語:

  • fulfill?- 將 promise 狀態從pending更改為fulfilled并具有特定的fulfillment 值

  • reject?- 將 promise 狀態從pending更改為rejected并給出特定的拒絕原因

  • resolve?- 直接(通過履行或拒絕)或間接(通過使其結果取決于另一個承諾的結果)來確定承諾的最終結果


查看完整回答
反對 回復 2023-05-11
?
largeQ

TA貢獻2039條經驗 獲得超8個贊

您正在將已解決的承諾推送到您的數組 ( requests.push(await axios.post()))。只需推送 Promises 而無需等待它們(requests.push(axios.post()))。然后就Promise.all可以做它的工作了。


const doUpload = async(fileList: FileList) => {

    const requests: Array < void | Promise<any> > = [];


    Array.from(fileList).forEach( file => {

        const formData = new FormData();

        const blob = new Blob([file]);

        formData.append(file.name, blob);


        requests.push(axios.post(/* ... */ ));

    });


    try {

        const data = await Promise.all(requests);

        console.dir(data);

    } catch (error) {

        console.log(error);

    }

};


查看完整回答
反對 回復 2023-05-11
  • 2 回答
  • 0 關注
  • 264 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號