Firebase ver9 调整 React 中的 snapshop/sub 集合答案

【问题标题】：Firebase ver9 adjustment of snapshop/sub collection in ReactFirebase ver9 调整 React 中的 snapshop/sub 集合
【发布时间】：2021-11-01 09:58:22
【问题描述】：

我正在尝试将以下代码 (ver8) 替换为 firebase SDK ver9（模块化样式）。但到目前为止没有成功。

useEffect(() => {
    const unsub = db
      .collection("posts")
      .doc("postId")
      .collection("comments")
      .orderBy("timestamp", "desc")
      .onSnapshot((snapshot) => {
         //update some state
      });
    return () => {
      unsub();
    };
  }, []);

我尝试通过参考以下官方示例使用查询与orderBy一起访问此子集合，但找不到有效的解决方案，特别是如何处理查询中的子集合引用。（如何在ver9中实现“collection().doc().collection().orderBy().onSnapshot”？）

如果有人给我提示，我真的很感激。 BR

https://firebase.google.com/docs/firestore/query-data/listen

https://firebase.google.com/docs/firestore/query-data/order-limit-data

【问题讨论】：

标签： javascript firebase google-cloud-firestore

【解决方案1】：

据我在collection function 的文档中看到的，您可以将整个路径作为字符串传递。

所以应该是这样的：

...
const db = getFirestore();
const commentsRef = doc(db, "posts", postId, "comments");

【讨论】：

【解决方案2】：

@Frank-san 非常感谢您的提示。现在，使用完整路径参数（您的提示）一切正常，如下所示。

 useEffect(() => {
    const q = query(
      collection(db, "posts", props.postId, "comments"),
      orderBy("timestamp", "desc")
    );
    const unSub = onSnapshot(q, (snapshot) => {
          //Some process
    });
    return () => {
      unSub();
    };
  }, []);

再次感谢，祝你有美好的一天！

【讨论】：