Creare un layout sezione che supporti il caricamento ritardato

La lista di contenuti può chiamare il layout sezione con componenti aggiuntivi durante l'esecuzione delle query.

Per il rendering di una lista di contenuti, è possibile selezionare un layout sezione per visualizzare tutti gli elementi di contenuto restituiti. Ciò consente di creare vari layout diversi per gli elementi di contenuto, ad esempio una tabella, un dispositivo di scorrimento o un layout a otto colonne. Questi layout sezione personalizzati possono essere utilizzati anche nelle funzioni di impaginazione più avanzate.

Le liste di contenuti supportano i tipi di impaginazione seguenti:

  • Impaginazione
  • Carica allo scorrimento
  • Carica al clic

Con la funzione di impaginazione standard non sono previste operazioni per il layout sezione. Ne verrà eseguito di nuovo il rendering con il set di elementi successivo quando l'utente farà clic sulla pagina successiva. Con l'impaginazione di tipo Carica allo scorrimento e Carica al clic, invece della ripetizione del rendering del layout sezione, vengono aggiunti altri componenti al layout sezione. Questo procedimento viene utilizzato generalmente per il modello di scorrimento infinito, che prevede il caricamento dei primi n elementi e, quando l'utente scorre la pagina verso il basso, il recupero e il rendering del set di elementi successivo. Per supportare l'impaginazione Carica allo scorrimento e Carica al clic, il layout sezione deve:

  1. render.js: implementare l'interfaccia API addComponent(). L'interfaccia verrà chiamata con ogni nuovo componente aggiunto al layout sezione.

    // 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: includere il frammento di codice seguente in modo da comunicare alla lista di contenuti che il layout sezione supporta l'interfaccia API addComponent().

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

Dopo l'aggiornamento di appInfo.json, quando seleziona questo layout sezione nel pannello Impostazioni e accede alla pagina di impaginazione, l'utente vede le opzioni Carica al clic e Carica allo scorrimento.