时间戳

首页 > 解决方案 > 当要返回的对象在其中更新时，如何使异步函数按顺序工作

reactjs - 当要返回的对象在其中更新时，如何使异步函数按顺序工作

问题描述

我正在尝试更新我的异步函数中的地图，因此我希望仅在执行循环但首先返回未定义的值时才返回地图，这会破坏我的代码。如何推迟这个退货声明？

async function getResourceDataMap(stationCode, event) {
    let file = event.target.files[0];
    let sheetIndexMap = await readXlsxFile(file, { getSheets : true} );
    let resourceDataMap = {};

    /*
         Consider all the sheets
         */
      sheetIndexMap.map(async (sheet) => {
      let sheetName = sheet.name;

      if(isSheetNameValid(sheetName)) {
        console.log("Entered for sheetName::" + sheetName);
        let sheetRows = await readXlsxFile(file, { sheet: sheetName });
        if (sheetRows != null && sheetRows.length > 1) { // we need atleast two rows
            let headers = sheetRows[0];
            console.log("header obtained is:" +headers);

            if(isColumnNamesValid(sheetName, headers)) {
                let sheetMapList = getSheetMap(sheetRows);
                console.log("SheetMapList obtained is:" + sheetMapList);

                // STEP : Create a map of the various sheets (corresponding to each resource type)
                console.log("SheetName here is::::::::" +sheetName);
                resourceDataMap[sheetName] = {
                    headerRows: headers,
                    sheetMapList : sheetMapList
                };
                console.log("Resource data Map within :" + resourceDataMap["PRE_STAGING_AREA"]);
            }
        }
      }
    })
    console.log("Resource data Map HEREEEE :" + resourceDataMap["PRE_STAGING_AREA"]);
    return resourceDataMap;

}

resourceDataMap 正在这里更新。

标签： reactjsasynchronousreduxpromiseasync-await

解决方案

您正在使用它返回承诺数组的async回调。map因此，将 promise 数组存储在一个变量中，然后在最后执行 Promise.all。

像这样

async function getResourceDataMap(stationCode, event) {
  let file = event.target.files[0];
  let sheetIndexMap = await readXlsxFile(file, { getSheets: true });
  let resourceDataMap = {};

  const promiseArr = sheetIndexMap.map(async (sheet) => { //<---- store array of promises obtained by map in a variable
    let sheetName = sheet.name;

    if (isSheetNameValid(sheetName)) {
      console.log("Entered for sheetName::" + sheetName);
      let sheetRows = await readXlsxFile(file, { sheet: sheetName });
      if (sheetRows != null && sheetRows.length > 1) {
        // we need atleast two rows
        let headers = sheetRows[0];
        console.log("header obtained is:" + headers);

        if (isColumnNamesValid(sheetName, headers)) {
          let sheetMapList = getSheetMap(sheetRows);
          console.log("SheetMapList obtained is:" + sheetMapList);

          // STEP : Create a map of the various sheets (corresponding to each resource type)
          console.log("SheetName here is::::::::" + sheetName);
          resourceDataMap[sheetName] = {
            headerRows: headers,
            sheetMapList: sheetMapList,
          };
          console.log(
            "Resource data Map within :" + resourceDataMap["PRE_STAGING_AREA"]
          );
        }
      }
    }
  });
  return Promise.all(promiseArr).then(x => { //<----make sure to do return here
      console.log(
        "Resource data Map HEREEEE :" + resourceDataMap["PRE_STAGING_AREA"]
      );
      return resourceDataMap;
  })
}

推荐阅读