Question

我有此功能，当页面加载并显示消息时会调用此功能。但是，我需要一个实时侦听器来仅显示第二个用户发布到集合的消息。也就是说，当user2发送一条消息并将其发布到集合中，然后在user1上进行更新

function fetchMessages(){
    dbRef= db.collection("user").doc("eF1RFw3FVAO3LFJ8ORrf7oJPyR13").collection('messages').orderBy("dbTime", "asc");
    dbRef.get().then((snapshot) =>{
        snapshot.docs.forEach(doc =>{
            if(doc.data().id===1){
                renderUser1Messages(doc);
            }
            else{
                renderUser2Messages(doc);
            }

        });
    });
}

我当时正在考虑删除整个函数，并将其全部做成快照侦听器。当user2发送消息时，此方法效果很好，然后将其实时显示给user1。但是，现在当user1发送一条消息时，它会显示两次。监听器正在猜测触发并使用db中的更新值也为user1调用该函数。

    dbRef.onSnapshot(function(snapshot) {
    snapshot.docChanges().forEach(function(change) {
     if(change.type==="added" && (change.doc.data().id==="1")){
            renderUser1Messages(change.doc);
        } else
        if(change.type==="added" && (change.doc.data().id===2)){
            renderUser2Messages(change.doc);
        }
    }); 
});

如何解决此问题

Answer 1

Firestore中可能发生多种类型的更改，每种更改都由change.type的值指示：

添加了一个新文档，该文档由值added表示。在这种情况下，您需要将新文档添加到您的UI。
已删除现有文档，该文档由值removed表示。在这种情况下，您需要删除该文档的现有UI元素。
已更改现有文档，该文档由值modified表示。在这种情况下，您需要更新该文档的现有UI元素。

您的代码似乎只关心第3种情况，在这种情况下，文档已更新，但是您正在处理它，就像添加了新文档一样。

您将需要查找文档的现有UI元素，然后进行更新。或者，您可以通过删除现有的UI元素并为文档添加新的UI元素来进行处理（如情况2，后跟情况1）。

查询的一个副节点：如果数据库中不仅有文档1和2，那么您的代码现在将下载比您所需更多的文档。在这种情况下，我强烈建议您使用两个单独的onSnapshot侦听器，在您实际上关心的每个文档中一个。

设置一个实时侦听器以收集具有两个唯一ID Firestore的文档

1 个答案: