DocumentazioneAEM GuidesDocumentazione di AEM Guides

Widget di rendering

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Creato per:

  • Utente
  • Amministratore

È possibile eseguire il rendering di un widget facendo riferimento ad esso utilizzando il relativo id

Per eseguire il rendering del widget widget_languages in qualsiasi punto dell'app, è possibile utilizzare la sintassi semplice:

{
    "component": "widget",
    "id": "widget_languages"
}

I widget possono essere utilizzati anche per eseguire il rendering di elementi complessi, ad esempio per eseguire il rendering dell’elenco dei collaboratori di ciascun file.
In questo caso, il widget può essere costruito come:

const widgetJSON =  {
    component: "div",
    id: "file_contributors",
    items: [ // adding components to the widget
        {
            component: "div",
            items: [
                {
                    component: "icon",
                    icon: "file"
                },
                {
                    component: "label",
                    label: "@fileName"
                }
            ]
        },
        {
            component: "list",
            data: "@contributors",
            itemConfig: {
                component: "label"
            }
        }
    ]
},

Ora, per eseguire il rendering di un elenco di collaboratori per ciascun file, scriviamo l’elenco come:

const listJSON = {
    component: "list"
    data: "@files"
    itemConfig: {
        component: "widget",
        id: "file_contributors"
    }
}

@files è un elenco di oggetti file contenenti campi

- fileName: string
- contributors: Array<String>
recommendation-more-help
11125c99-e1a1-4369-b5d7-fb3098b9b178