DokumentationAEM GuidesDokumentation zu AEM Guides

Rendern von Widgets

Last update: Thu Dec 19 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Erstellt für:

  • Benutzende
  • Admin

Wir können ein Widget rendern, indem wir es mithilfe seiner id referenzieren

Um das Widget an einer beliebigen Stelle in der App widget_languages zu rendern, können wir die einfache Syntax verwenden:

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

Widgets können auch verwendet werden, um komplexe Elemente zu rendern, z. B. um die Liste der Mitwirkenden für jede Datei zu rendern.
Hier kann das Widget wie folgt aufgebaut werden:

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"
            }
        }
    ]
},

Um nun für jede Datei eine Liste der Mitwirkenden zu rendern, schreiben wir die Liste wie folgt:

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

Im Folgenden finden @files eine Liste von Dateiobjekten mit Feldern

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