Firebase 实时数据库的分页

我一直在尝试寻找一种为 Firebase 实时数据库进行分页的方法。我看到很多关于 Cloud Firestore 分页的教程/文章，但没有看到关于实时数据库的分页。下面是我的代码及其按预期工作。谁能指出我添加分页的正确方向？如果可能的话？任何帮助，将不胜感激。

  const [ufoSightings, setUfoSightings] = useState([]);
  const [userStateSelection, setUserStateSelection] = useState("");

  useEffect(() => {
    let allUfo = [];

    //referencing firebase db
    const ufoRef = firebase.database().ref("ufos");
    //filter database searching for specific state user is looking for
    const query = ufoRef
      .orderByChild("state")
      .equalTo(`${userStateSelection}`)
      .limitToFirst(12);

    query.once("value").then((snapshot) => {
      //storing ufoSightings in state
      snapshot.forEach((snap) => {
        allUfo.push(snap.val());
      });
      setUfoSightings(allUfo);
    });
  }, [userStateSelection]);

要获取下一页，您需要传入state以及在其或之后开始的节点的键

假设您使用以下命令捕获侦听器中的值：

var lastState, lastKey;
query.once("value").then((snapshot) => {
  //storing ufoSightings in state
  snapshot.forEach((snap) => {
    allUfo.push(snap.val());
    lastState = snap.val().state; // ????
    lastKey = snap.key; // ????
  });
  setUfoSightings(allUfo);
});

现在您可以使用以下查询获取下一页：

const query = ufoRef
  .orderByChild("state")
  .equalTo(`${userStateSelection}`)
  .startAfter(lastState, lastKey) // ????
  .limitToFirst(12);

The startAfter()方法对于实时数据库来说相对较新，因此如果您找不到它或遇到问题，请尝试（更旧的）startAt()具有相同参数的方法。

另请查看有关的许多其他问题firebase-realtime-database分页 https://stackoverflow.com/search?q=%5Bfirebase-realtime-database%5D+pagination，因为这里已经经常介绍这一点。