时间戳

首页 > 解决方案 > 回调函数完成后执行代码

javascript - 回调函数完成后执行代码

问题描述

我想在此代码 Ts 文件中的所有回调完成后执行 addFormLayoutSectionFieldsView() 函数

webPart._getListDataSources(xComp).then((response) => {
            let dItems: List_Item[] = response.value;
            dItems.forEach((item: List_Item) => {
              dataSourceId = item["Id"];
              webPart._getListDataSourceFieldsData(dataSourceId).then((response) => {
                let pItems: List_Item[] = response.value;
                pItems.forEach((item: List_Item) => {
                  AddSectionFieldHtml1 += `<option value= "${item["Id"]}"> ${item["Id"]} </option>`;
                  console.log(AddSectionFieldHtml1);
                });
              });
            });
          });
            
webPart.addFormLayoutSectionFieldsView(FormLayoutSectionId);```

标签： javascripttypescript

解决方案

为了解决这个问题，我一直在Promise.all旁边使用map

webPart._getListDataSources(xComp).then((response) => {
            Promise.all(response.value.map((item: List_Item) => {
              dataSourceId = item["Id"];
              return webPart._getListDataSourceFieldsData(dataSourceId).then((response) => {
                let pItems: List_Item[] = response.value;
                pItems.forEach((item: List_Item) => {
                  AddSectionFieldHtml1 += `<option value= "${item["Id"]}"> ${item["Id"]} </option>`;
                  console.log(AddSectionFieldHtml1);
                });
              });
            });
          })).then(() =>             
            webPart.addFormLayoutSectionFieldsView(FormLayoutSectionId);
          )```

因此，这里不仅仅是迭代所有项目并进行新的异步调用，而是将每个项目变成一个 Promise，用 收集该 Promise 数组Promise.all，然后当所有 Promise 完成时，执行传递给Promise.all(...).then.

例如，

Promise
  .all([1,2].map(Promise.resolve)
  .then(() => console.log('Done with promises!'))

这将变成承诺，然后当两者都解决时，控制台将被登录1。2

推荐阅读