Firebase v9 模块化 - 如何使用 onSnapshot 返回可观察值？

Question

我正在尝试使用 Firebase v9 模块化版本，但我对如何使用 onSnapshot 感到困惑。我正在尝试执行查询并收听文档。

以下是我的代码：

    getUsersBoards(){

    return this.authService.currentUser$.pipe(
      filter((user)=> !!user),
      mergeMap(async (user) => {
        const collectionRef = collection(this.firestore, 'boards');

        const q = query(collectionRef, where("owner", "==", user.uid));

        return onSnapshot(q, (querySnapshot)=>{
          return querySnapshot;
        });

      })
    );
    
  }

我本来期待一个

Observable<board[]>

，但我得到了一个

Observable<unsubscribe>

有没有办法让我可以执行以下操作？

boards$: Observable<board[]>;

...
this.boards$ = getUsersBoards();

Answer 1

您会得到

Observable<unsubscribe>

，因为根据 Firebase 文档，

onSnapshot

返回“[a]n 取消订阅函数，可以调用该函数来取消快照侦听器。”

在返回之前，首先尝试将快照转换为可观察对象。例如：

        new Observable(observer => {
          return onSnapshot(reference,
            (snapshot => observer.next(snapshot.data())),
            (error => observer.error(error.message))
          );
        });

Answer 2

@user1012500，对于您的评论，我认为应该处理取消订阅

我在最近的一个完全键入的项目中使用了它，因此很容易阅读，但请随意忽略管道：

public getUserGroupsOfUser(userId: UserId) {
    const studentGroupQuery = query(
      collection(this.firestore, 'users', userId, 'userGroups')
    );

    return new Observable(
      (subscriber: Subscriber<QuerySnapshot<DocumentData>>) => {
        subscriber.unsubscribe = onSnapshot(studentGroupQuery, subscriber);
      }
    ).pipe(
      map((querySnapshot) => {
        if (querySnapshot.empty) {
          return undefined;
        }
        return querySnapshot.docs
          .filter((doc) => doc.exists())
          .map((doc) => {
            return userGroupConverter.fromFirestore(doc, {})!;
          });
      })
    );
  }