Question

我最初使用limitToLast(5)从我的数据库节点加载最后5个项目，如下所示：

var myData = [];
var firstKey;

var fetchInitialData(category){
    firebase.database().ref(category).orderByKey().limitToLast(5).once('value' , function(snap){
        addDatToArray(snap);
    });
}

fetchInitialData('myCategory');

var addDatToArray = function(snap){
    snap.forEach(function(child){
        myData.push(child.val());
        if(!firstKey){
            firstKey = child.key;
        }
    });
}

我有一个加载更多按钮，可以获取另外5个项目并将其推送到myData[]。由于我在初始提取中存储firstKey，因此我将其传递给endAt()，如下所示：

var fetchMoreData(category){
    firebase.database().ref(category).orderByKey().endAt(firstKey).limitToLast(5).once('value' , function(snap){
        firstKey = null;
        addDatToArray(snap);
    });
}

它工作正常，但问题是因为我使用endAt()获取更多数据并限制数据，而endAt()也包括结尾品脱的项目。因此，对于每个加载更多数据，一个项目在myData数组中重复。

为了描述，请考虑以下示例：

我的数据结构

----category
    --item1
    --item2
    --item3
    --item4
    --item5
    --item6
    --item7
    --item8
    --item9
    --item10

初始提取时

1。我获取最后5个项目6-10项，firstKey设置为item6。显示给用户的项目是

item6
item7
item8
item9
item10

2。在加载时，firstKey的{{1}}传递给item6，endAt()包含endAt()，它也会提取item6 1}}并将其推送到myData[]

向用户显示的项目是

item6
item7
item8
item9
item10

item5
item4
item3
item2
item6//fetched again

如何克服这个问题

Answer 1

在向数组添加数据时，如果它与endAt查询的键匹配，则可以忽略该子项？因此，您的addDatToArray方法将需要多一个参数，例如：

var addDatToArray = function(snap, ignoreKey){
    snap.forEach(function(child){
        if(child.key != ignoreKey) {
            myData.push(child.val());
        }
        if(!firstKey){
            firstKey = child.key;
        }
    });
}

来自firebase.database.Query#endAt的文档：

结束点是包含性的，因此具有指定值的子项将包含在查询中。

因此，您需要通过将limitToLast调整为+1然后丢弃重复结果来说明这一点。

使用endAt加载更多数据

1 个答案: