Zum Hauptinhalt springen

Unterkopfzeile

Note: Diese Komponente darf nur im Rahmen der Header UX-Muster und nicht isoliert oder in eigenen Szenarien verwendet werden.

Die SubApplicationHeader-Komponente rendert einen sekundären Header für Ihre Anwendung.

Sie können Artikel mit den folgenden Eigenschaften anzeigen:

  • contextSwitcher – nimmt ein Objekt mit einer defaultLabel und ein Array von Routen entgegen.
  • navigationRoutes – nimmt ein Array von Routen entgegen. Sie können verschachtelte Routen für die Navigation auf mehreren Ebenen festlegen. Wenn es zu viele Routen für die Anzeige gibt, rendert die Komponente ein „Mehr“-Menü.

Benutzerdefinierte Komponenten​

Verwenden Sie die renderCustomComponent-Eigenschaft, um Ihrer Unterkopfzeile benutzerdefinierte Komponenten hinzuzufügen. renderCustomComponent kann entweder Ihre benutzerdefinierte Komponente oder eine Funktion, die Ihre Komponente rendert, beinhalten.

Ihre benutzerdefinierte Komponente wird nach Ihren Routen platziert. Wenn es zu viele Routen gibt und das „Mehr“-Menü angezeigt wird, bleibt die benutzerdefinierte Komponente auf dem Bildschirm. Beachten Sie, dass Sie ein eigenes Styling für diese Komponente angeben müssen.

Benutzerdefinierte Komponenten auf einem Mobilgerät​

Wenn Sie Ihre Unterkopfzeile auf einem Mobiltelefon oder Tablet anzeigen, werden benutzerdefinierte Komponenten im Burger-Menü gerendert. Diese Funktion ist nur anwendbar, wenn die Unterkopfzeile als Teil eines Grundrisses verwendet wird. Wenn FloorPlans nicht verwendet wird, wird die benutzerdefinierte Komponente auf Mobilgeräten nicht gerendert.

Beispiele finden Sie in Storybook.

On this page