首页 > 解决方案 > 为什么异步等待在此功能中不起作用?

问题描述

这可能是一个初学者的问题,但我无法弄清楚:

我正在做一个异步数据库调用,我想从数据库中获取一个对象并将这个对象分配给窗口对象(window.naamID)。

接下来我想运行一个函数,我使用分配给窗口对象的对象(使其成为全局对象)并将其用作数据库查询(.where(“Vraagsteller”,“==”,naamID))。

当然,问题是第二个函数在第一个函数完成之前开始运行(因为它是异步的)。

我想通过将第二个函数包装在同步函数中并等待第一个函数来克服这个问题。

这似乎不是工作。控制台说分配给窗口对象的对象是未定义的。

控制台日志快照

这是代码:

 function constructAuthMenu(){
auth.onAuthStateChanged(User =>{

    const userRef = db.collection("Vitaminders")
    .doc(User.uid);
    userRef.get()
    .then(function(doc) {

        const naamID = doc.data().Gebruikersnaam;
        const ID = doc.data().ID
        const naam = naamID.replace(ID, "")
        const profilePic = doc.data().Profielfoto

        window.naamID = naamID
     });
  });
}; 

constructAuthMenu()

 async function getNewReactions(){

        await constructAuthMenu()

      db.collectionGroup("Reactions")
      .where("Vraagsteller", "==", naamID)
      .where("New", "==", 
       "Yes").get().then(querySnapshot => {
        querySnapshot.forEach(doc => {

       *Do stuff*

   });
});

我究竟做错了什么?或者异步等待不是这样工作的吗?

标签: javascriptasync-await

解决方案


如果constructMenuFunction您的代码中确实存在其他地方,并返回一个 Promise,那么您的问题是您的函数调用中缺少括号:await constructMenuFunction();

如果constructMenuFunction在您的代码中的其他地方不存在,并且异步函数之前的第一个函数实际上是您希望调用的,那么您的问题是第一个函数没有返回 Promise 并且您的异步函数调用了错误的方法并且没有括号。

async function constructAuthMenu() {
  return await auth.onAuthStateChanged(async User => {
    try {
      const userRef = db.collection("Vitaminders").doc(User.uid);
      const doc = await userRef.get();
      const naamID = doc.data().Gebruikersnaam;
      const ID = doc.data().ID;
      const naam = naamID.replace(ID, "");
      const profilePic = doc.data().Profielfoto;
      return naamID;
    } catch(err) {
      console.error(err);
    }
 });
};

推荐阅读