我最初使用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(即item6)传递给endAt(),并且由于endAt()包含在内,因此它还会获取item6并将其推送到myData[]

显示给用户的项目是

item6
item7
item8
item9
item10

item5
item4
item3
item2
item6//fetched again


如何克服这个问题

最佳答案

在向数组添加数据时,如果子项与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,然后丢弃重复的结果来解决这一问题。

10-08 16:15