.then 的链接不起作用

Question

我正在将 Firebase 用于一个项目，并且在链接 then() 时遇到问题。

我将有关用户的数据存储在对象中。用户的属性之一是对另一组名为事件的数据的引用的数组。我循环访问引用以读取 Firestore（Firebase DB）中的数据并将其存储到名为“user”的本地对象中。

在打印用户对象时，首先显示第三个 then() 的输出语句。从逻辑上讲，每个 then 应该在上面的那个之后执行，但第三个 then() 异步执行并首先打印输出。这是什么原因呢？此外，任何 then() 都没有返回任何值。这是问题的根源吗？

orgRef.collection('collection').doc('doc').get()
  .then(function(data){
  user.info = data.data();
})
  .then(function(){
  user.info.events.forEach(function(event){
    eventRef.get()
      .then(function(data){
      user.eventdata[event] = data.data()[event];
    })
      .then(function(){
      console.log(user);
    });
  });
})
  .then(function(){
  console.log('AT END');
  console.log(user);
});

我已经添加了输出，每个 console.log 语句都打印相同的对象“用户”。该对象被打印了三次，因为循环执行了两次并打印了该对象。第三个是因为主 get() 承诺的 then() 语句。

AT END
{ 
  eventdata: {} 
}
{ 
  eventdata:
   { FEENbYcy04k6XPR148rv:
       //more data
   } 
}
{ 
  eventdata:
   { FEENbYcy04k6XPR148rv:
       //more data
     622kUqbF9jftq1nKkQSb:
       //more data  
   } 
}

Answer 1

相反，您需要正确地链接承诺。事实上，你的eventRef.get().thens 与你的 Final 没有连接'AT END'。

用于Promise.all将一系列 Promise 转换为单个 Promise，然后返回第三个 Promise then。

orgRef.collection('collection').doc('doc').get()
  .then(function(data) {
    user.info = data.data();
  })
  .then(function() {
    const allPromises = user.info.events.map(function(event) {
      return eventRef.get()
        .then(function(data) {
          user.eventdata[event] = data.data()[event];
        })
        .then(function() {
          console.log(user);
        });
    });
    return Promise.all(allPromises);
  })
  .then(function() {
    console.log('AT END');
    console.log(user);
  });

您还可以通过利用 ES6 箭头函数和隐式返回来使其更加简洁：

orgRef.collection('collection').doc('doc').get()
  .then(data => user.info = data.data())
  .then(() => (
    Promise.all(user.info.events.map((event) => (
      eventRef.get()
        .then(data => user.eventdata[event] = data.data()[event])
        .then(() => console.log(user))
    )))
  ))
  .then(() => {
    console.log('AT END');
    console.log(user);
  });