首页 > 解决方案 > 用列表承诺所有并在里面追加

问题描述

我有两个包含异步操作的函数,它们返回一个列表。我使用 promise all 来同时执行它们。第一个列表有效,但第二个列表显示未定义。

let content = "<div class='clsLines'>";

return Promise.all([
    firstList()
]).then((messages) => {
    content+= messages
    secondList()
}).then((messages) => {
    content+= messages
   
    content+="</div>"; // close clsLinesDiv
    $('#id').find('.cls').append(content); // append the lists in a div
});

如何显示第二个列表而不是未定义的?关闭 div 和 append 应该在承诺之内还是之外

谢谢 !

标签: javascriptasynchronouspromise

解决方案


您没有同时执行它们。你是secondList()在之后开始的firstList()。但无论如何,你看到的是你所看到的,因为你错过了一个return陈述。它应该是

.then((messages) => {
    content+= messages
    return secondList()
})

但是,您实际上可以“并行”执行这些承诺并避免共享变量:

Promise.all([firstList(), secondList()])
  .then(([firstResult, secondResult]) => {
    $('#id').find('.cls')
      .append(`<div class='clsLines'>${firstResult}${secondResult}</div>`);
  })

推荐阅读