Firebase、React - onChildAdded 供查询参考

Question

在我的应用程序中，我想监听添加的儿童，因此我使用

onChildAdded

监听器。当侦听器最初被调用时，我不想获取该位置的所有数据，只想获取最新的条目，并且我想侦听在该位置添加的新子项。

我编写了以下代码来尝试实现此目的：

  // Only get the last entry at the location
  let queryRef = query(child(dbRef, `messages/${cd.key}`), limitToLast(1))

  // This should initially only get the last entry, and then listen to future changes, i.e new children
  onChildAdded(queryRef).then((snap) => {
    console.log(snap.val());
  })

但是，运行代码时，出现以下错误：

(0 , firebase_database__WEBPACK_IMPORTED_MODULE_4__.onChildAdded)(...).then 不是函数

在搜索其他解决方案后，我找到了一个我相信可以解决此问题的解决方案，但代码已过时。这是代码：

var queryRef = ref.orderBy('created').startAt(Firebase.ServerValue.TIMESTAMP);

queryRef.on('child_added', function(snap) {
  console.log(snap.val());
});

我如何修改我的解决方案，以便我最初只获得该位置的最新条目，然后添加所有新的子项。谢谢。

Answer 1

您在问题中共享的这段代码使用 Firebase 的命名空间 API：

var queryRef = ref.orderBy('created').startAt(Firebase.ServerValue.TIMESTAMP);

queryRef.on('child_added', function(snap) {
  console.log(snap.val());
});

模块化 API 中的等效项是：

var queryRef = query(ref, orderBy('created'), startAt(Firebase.ServerValue.TIMESTAMP));

onChildAdded(queryRef, function(snap) {
  console.log(snap.val());
});

如果你仔细观察，你会发现这主要是移动物体的问题。要了解有关这两个 API 以及它们如何相互映射的更多信息，请参阅有关 从命名空间 API 升级到模块化 API 的文档。

---

请注意，我认为此代码片段中的方法不起作用，因为

startAt(Firebase.ServerValue.TIMESTAMP)

不起作用。老实说，获得新孩子的最简单方法是：

var queryRef = query(ref, orderBy('created'), limitToLast(1));

onChildAdded(queryRef, function(snap) {
  console.log(snap.val());
});

在这里，当你第一次运行时，你会得到最新的孩子

onChildAdded

（没有办法避免这种情况），然后只有新的孩子。