如何在 Firebase 中使用 onSnapshot？无法在我的应用中运行

Posted 2023-02-22

【中文标题】如何在 Firebase 中使用 onSnapshot？无法在我的应用中运行

【英文标题】：How to use onSnapshot in firebase? Can't work in my apps

【发布时间】：2021-12-23 14:33:19

【问题描述】：

我制作了自己的网络应用程序（使用 vue.js）并使用 firestore 作为后端。 在我的 firebase 方法中，我尝试在 firestore 中使用 onSnapshot 方法， 但结果未定义。

firebase 版本是最新的 (v9)。

所以我的代码在下面。

let user;
    const snapshot = await onSnapshot(collection(db, "user"), (snap: any) => 
      let user: any = [];
      snap.docs.forEach((doc: any) => 
        user.push( ...doc.data() );
      );
      return user;
    );
    snapshot();
    console.log(user);

我的 Firestore 数据如下所示。

collection: user
documet: uid(automatically made by firebase)
data:
 name:'someone name',
 age:22

所以我期待这样的结果

 name:'someone name',
 age:22

但结果是“未定义” 有人给我建议吗？

【参考方案1】：

onSnapshot 函数不返回Promise，因此您不能在其上使用await。你要找的是getDoc:

const snap = await getDocs(collection(db, "user"));
let user: any = [];
snap.docs.forEach((doc: any) => 
  user.push( ...doc.data() );
);
console.log(user);

另请参阅 getting a document once 上的 Firebase 文档。

【讨论】：

getDocs() 用于 CollectionReference :)

@Dharmaraj Darn。我检查了两次，特别是那个，但仍然错过了！ ? 在漫长的 FireConf 日之后，我真的不应该回答 v9 问题。 ?谢谢你的保存。 ?

我使用快照的原因，我想通过该方法获得实时更新。如果我改用 getDocs 方法，该方法是否可以获取实时数据？或者我必须在 firestore 数据库更改时调用该函数。

您不能将await 与流一起使用，因为await 仅等待 一次值。你不能等待一个流;毕竟——什么时候完成？如果您想使用onSnapshot，任何需要数据库数据的代码都需要在onSnapshot 回调中，或者从那里调用。回调中的return 将不起作用。