Oprette et sektionslayout, der understøtter lazy-indlæsning

Indholdslisten kan kalde sektionslayoutet med yderligere komponenter, når der forespørges om dem.

Når du gengiver en indholdsliste, kan du vælge et sektionslayout for at gengive alle de indholdselementer, der returneres. Det giver dig mulighed for at oprette forskellige layouts til indholdselementer, for eksempel en tabel, en skyder eller et layout med otte kolonner. Disse tilpassede sektionslayouts kan også medtages i de mere avancerede sideinddelingsfunktioner.

Indholdslister understøtter følgende sideinddeling:

  • Sideinddeling
  • Indlæs ved rulning
  • Indlæs ved klik

Til standardfunktionen for sideinddeling behøver sektionslayoutet ikke at gøre noget. Det gengives igen med det næste sæt af elementer, når brugeren klikker på den næste side. Men for Indlæs ved rulning og Indlæs ved klik bliver yderligere komponenter føjet til sektionslayoutet i stedet for et gengive det igen. Det bruges mest til den uendelige rullemodel, hvor du indlæser de første n elementer, og du henter og gengiver det næste sæt elementer, når brugeren ruller ned på siden. Hvis du skal understøtte Indlæs ved rulning og Indlæs ved klik skal det tilpassede sektionslayout gøre følgende:

  1. render.js: Implementere API'en addComponent(). Den kaldes med hver ny komponent, der skal føjes til sektionslayoutet.

    // dynamic API for adding additional components through "load more" when used in a Content List
               addComponent: function (parentObj, component) {     
                   // create the component div and add it to the parent object
                   $(parentObj).append(this.createComponentDiv(component)); 
               }
  2. appInfo.json: Medtage følgende, så indholdslisten ved, at sektionslayoutet understøtter addComponent() api.

    "contentListData": {  
      "addComponent": true
    },

Når appInfo.json opdateres, når brugeren vælger dette sektionslayout i indstillingspanelet og går til skærmen for sideinddeling, kan brugeren se valgene Indlæs ved klik og Indlæs ved rulning.