首页 > 解决方案 > querySnapshot 文档上的 reverse() 不起作用?

问题描述

我正在尝试翻转我的查询快照文档,但没有任何反应:

export async function getUserPosts(
  userId,
  getOldPosts = true,
  startAfter,
  limit = MAX_USER_POSTS_TO_RETRIEVE
) {
  ...

  const query = userPostsRef
    .orderBy("date", getOldPosts ? "desc" : "asc")
    .startAfter(startAfter);

  const querySnapshot = await query.limit(limit).get();

  if(!getOldPosts) {
    console.log("=== BEFORE ===");
    querySnapshot.docs.forEach((prev) => {
      console.log(prev.data().date.toDate());
    });

    // Flip the docs if we are fetching new posts
    querySnapshot.docs.reverse(); <-----

    console.log("=== AFTER FLIP ===");
    querySnapshot.docs.forEach((prev) => {
      console.log(prev.data().date.toDate());
    });
  }

  ...
}

当我像这样调用我的方法时:

getUserPosts("...", false, new Date()); // will execute an orderBy("date", "asc")

控制台记录以下数据:

=== BEFORE ===
2021-11-08T20:57:31.382Z   // (oldest)
2021-11-08T20:57:32.816Z
2021-11-08T20:57:36.130Z   // (most recent)

=== AFTER FLIP ===
2021-11-08T20:57:31.382Z   // (oldest)
2021-11-08T20:57:32.816Z
2021-11-08T20:57:36.130Z   // (most recent)

如您所见,文档没有翻转...我希望得到

=== AFTER FLIP ===
2021-11-08T20:57:36.130Z   // (most recent)
2021-11-08T20:57:32.816Z
2021-11-08T20:57:31.382Z   // (oldest)

作为操作的结果,我不明白为什么如果以下代码无法正常工作:

const querySnapshot = {
  docs: [
    {
      data: () => ({ timestamp: 1 })
    },
    {
      data: () => ({ timestamp: 2 })
    }
  ]
}

// Before flipping: [1, 2]
querySnapshot.docs.reverse();

// Expected: [2, 1]
querySnapshot.docs.forEach((doc) => {
  console.log(doc.data().timestamp)
})

标签: javascriptfirebasegoogle-cloud-firestoreecmascript-6

解决方案


计算该QuerySnapshot.docs属性,并在每次调用它时返回一个新数组。它的实现

/** An array of all the documents in the `QuerySnapshot`. */
get docs(): Array<QueryDocumentSnapshot<T>> {
  const result: Array<QueryDocumentSnapshot<T>> = [];
  this.forEach(doc => result.push(doc));
  return result;
}

因此,您的reverse()调用会反转一个临时数组,而您随后的调用querySnapshot.docsthen 按数据库中的顺序返回一个新数组。


要解决此问题,请在第一次从 the 获取文档时存储对文档的引用,然后将其QuerySnapshot.docs反转

console.log("=== BEFORE ===");
let docs = querySnapshot.docs;
docs.forEach((prev) => {
  console.log(prev.data().date.toDate());
});

// Flip the docs if we are fetching new posts
docs.reverse(); <-----

console.log("=== AFTER FLIP ===");
docs.forEach((prev) => {
  console.log(prev.data().date.toDate());
});

推荐阅读