我想在前一个函数完成后调用一个函数reactjs答案

【问题标题】：i want to Call a function after previous function is complete reactjs我想在前一个函数完成后调用一个函数reactjs
【发布时间】：2022-01-02 17:36:44
【问题描述】：

我想在前一个函数完成后调用一个函数。我使用async 和await，但它不起作用：

  const getDate = async () => {
await Object.keys(baskets || {}).forEach(vendorCode => {
  recalculateBill({
    calculateOrder: true,
    shop: Tools.pickVendorFiled(baskets[vendorCode]),
    shopex: tab === DELIVERY_TYPES.NORMAL
  })
})

getShopexInfo({ ids: basketIds })
}

【问题讨论】：

使用 javascript 承诺
这能回答你的问题吗？ What is the difference between JavaScript promises and async await?

标签： javascript reactjs

【解决方案1】：

在 forEach 循环中使用 async/await 相当棘手，也许您可以尝试切换到 for of 循环，它与 async/await 配合得很好，您将实现您的目标想要或者你也尝试这样做

 const getDate = async () => {
 Object.keys(baskets || {}).forEach(await(vendorCode) => {
  recalculateBill({
    calculateOrder: true,
    shop: Tools.pickVendorFiled(baskets[vendorCode]),
    shopex: tab === DELIVERY_TYPES.NORMAL
  })
})

getShopexInfo({ ids: basketIds })
}

【讨论】：

【解决方案2】：

您可以使用for...in 循环而不是Object.keys(baskets || {}).forEach，其中await 将按预期工作：

async function getDate () {
  for (const vendorCode in baskets ) {
    await recalculateBill({ calculateOrder: true,
                            shop: Tools.pickVendorFiled(baskets[vendorCode]),
                            shopex: tab === DELIVERY_TYPES.NORMAL
                           });
  }
  getShopexInfo({ ids: basketIds })
}

【讨论】：

【解决方案3】：

这里的问题是你有一个循环，等待一个带有一些承诺的循环很棘手，你需要使用 Promise.all 来等待所有这些都完成，然后再继续下一个函数。

Promise All 接受一组承诺（我使用.map 而不是.forEach 来返回一组承诺），并返回一个承诺本身，这样你就可以等待它。

const getDate = async () => {
    const basketsArr =  Object.keys(baskets || {});

  await Promise.all(basketsArr.map((vendorCode) => 
    await recalculateBill({
      calculateOrder: true,
      shop: Tools.pickVendorFiled(baskets[vendorCode]),
      shopex: tab === DELIVERY_TYPES.NORMAL
    })
  ))
  
  await getShopexInfo({ ids: basketIds })
}

【讨论】：