在 forEach 中使用異步 API 調用的結果

Question

我正在調用返回用戶列表的 API，如下所示：

const users = await axios.get('/api/users/all');

res.data 現在是我的用戶數組，每個用戶都有一個名為 manager 的字段，該字段是來自另一個模式的經理的 id 我還有另一個 API 在提供他們的 id 時返回經理名稱

axios.get('/api/managers/managerName', id)

我想運行一個 forEach 將經理姓名插入到我的結果中，而不是他的 ID。 我在嘗試

const users= await axios.get('/api/users/all');
const final = users.data.forEach(function (element) {
      element.managerName= axios.get('/api/managers/managerName', element.id);
    });

但當然這不起作用，因為axios.get('/api/managers/managerName', element.id)返回 promise。 我怎樣才能解決這個問題？ 謝謝

Answer 1

據我所知，您不能在forEach或map中使用await 。 它不起作用（不等待）。 您必須使用for循環。

for( let element of users.data) {
    element.managerName = await axios.get('/api/managers/managerName', element.id);
}

Answer 2

您可以解決您的第二個 promise：

const final = users.data.forEach(async function (element) {
      element.managerName= await axios.get('/api/managers/managerName', element.id).then((manager) => manager.name);
    });

Answer 3

const users= await axios.get('/api/users/all');
const final = Promise.all(
users.data.map(async (element) => {
      element.managerName = await axios.get('/api/managers/managerName', element.id);
    }));