javascript - 然后返回 Promise 内的 Promise 链

Question

我想使用 axios 获取返回 objectId 数组列表的 API。获得列表 objectId 后，我想使用 Promise 获取对象的详细信息

我想到了这样的事情

var objectDetail = [];

axios.get('apiendpoint/')
.then((response) => {
  var listOfObjectId = response.data;
  var chain = Promise.resolve()
  for (var objectId of listOfObjectId) {
    chain = chain.then(axios.get(`apiendpoint/${objectId}`)
      .then((response) => {
        objectDetail.push(response.data);
      })
    );
  }
  return chain;
}).then((chain) => {
  console.log(chain);
  return chain;
})

上面的代码返回 undefined，promise 链对象没有传递给 then 方法调用。我的方法是错误的还是我错过了什么？谢谢

以下是我读过的一些堆栈，可能相关:

• How to loop dynamically over multiple promises in a for loop while using fetch?
• Creating a promise chain in a for loop

Answer 1

promise 链正在被传递到最终的.then，但是 promise 链没有返回任何东西:看看你的

.then((response) => {
  objectDetail.push(response.data);
})

该函数不返回任何内容。如果您想在链的末尾使用objectDetail而不引用外部变量，也返回它:

.then((response) => {
  objectDetail.push(response.data);
  return objectDetail;
})

但请注意

}).then((chain) => {
  console.log(chain);
  return chain;
})

有点多余 - 除非您这样做只是为了记录结果，最好完全放弃它。

如果您使用 Promise.all ，您的代码会更清晰:

axios.get('apiendpoint/')
  .then(({ data }) => Promise.all(
    data.map(objectId => (axios.get(`apiendpoint/${objectId}`)
      .then(res => res.data)
    ))
  ));