Firebase Lazy Load

Question

Ich versuche zu lazy laden Firebase-Elemente, um später mehr von ihnen zu laden, wenn Benutzer Ende des Div-Container erreicht. Wenn ich .endAt() und .startAt() entferne, empfange ich die 15 Einzelteile, obwohl sie nicht inkrementiert werden und es bei diesen 15 Einzelteilen fest ist.

Wenn ich halten .endAt() und .startAt() Ich erhalte Feuerbasis Warnung Using an unspecified index. Consider adding ".indexOn": "title" at /items obwohl .indexOn gesetzt. Ich bin verwirrt von dieser Warnung. Vielen Dank im Voraus für jede Hilfe.

Firebase Struktur

{ 
    "items" : { 
    "-Kk6aHXIyR15XiYh65Ht" : { 
     "author" : "joe", 
     "title" : "Product 1" 
    }, 
    "-Kk6aMQlh6_E3CJt_Pnq" : { 
     "author" : "joe", 
     "title" : "Product 2" 
    } 
    }, 
    "users" : { 
    "RG9JSm8cUndpjMfZiN6c657DMIt2" : { 
     "items" : { 
     "-Kk6aHZs5xyOWM2fHiPV" : "-Kk6aHXIyR15XiYh65Ht", 
     "-Kk6aMTJiLSF-RB3CZ-2" : "-Kk6aMQkw5bLQst81ft7" 
     }, 
     "uid" : "RG9JSm8cUndpjMfZiN6c657DMIt2", 
     "username" : "joe" 
    } 
    } 
} 

Sicherheitsregeln

{ 
    "rules": { 
    ".read": true, 
    ".write": "auth != null", 
    "users":{ 
     "$uid": { 
     ".write": "$uid === auth.uid" 
     "items":{ 
      ".indexOn": "title", 
      "$itemId": { 
      "title": {".validate": "...} 
      "type": {".validate": "...} 
      } 
      } 
     } 
     } 
    } 
    } 
} 

-Code-Struktur für faule Last

let _start = 0, 
    _end = 14, 
    _n = 15; 

function lazyLoadItems(){ 
    firebase.database().ref('items') 
     .orderByChild('title') 
     .startAt(_start) 
     .endAt(_end) 
     .limitToFirst(_n) 
     .on("child_added", snapshot=> console.log(snapshot.val())); 
    _start += _n; 
    _end += _n; 
} 

Answer 1

Sie sind Missverständnis, wie Firebase-Abfragen arbeiten. Es ist am einfachsten zu sehen, wenn Sie hartcodierte Werte verwenden:

firebase.database().ref('items') 
    .orderByChild('title') 
    .startAt(0) 
    .endAt(14) 
    .limitToFirst(15) 

Es gibt keine Artikel mit title=0 oder title=14, so dass die Abfrage nicht alles paßt.

Firebase-Datenbankabfragen stimmen mit dem Wert der Eigenschaft überein, an der Sie bestellen. Wenn Sie also title bestellen, müssen die Werte, die Sie in startAt und endAt angeben, Titel sein. Z.B.

ref.child('items') 
    .orderByChild('title') 
    .startAt("Product 1") 
    .endAt("Product 1") 
    .limitToFirst(15) 
    .on("child_added", function(snapshot) { console.log(snapshot.val()); }); 

Siehe für die Arbeitsprobe dafür: http://jsbin.com/hamezu/edit?js,console

Paginierung zu implementieren, werden Sie das letzte Element der vorherigen Seite erinnern und dass passieren, um den nächsten Anruf: startAt(titleOfLastItemOnPreviousPage, keyOfLastItemOnPreviousPage).