Zum Inhalt springen
fend-ui
Vorschau

Pagination

Seitennavigation mit Zahlen, Ellipsen und Zurück/Weiter. Mit getHref werden alle Ziele zu echten Links, ohne bleibt die Komponente bei Buttons und onPageChange; unterhalb von md genügt die kompakte Statuszeile.

Interaktiv

Die aktive Seite trägt aria-current=page und den Secondary-Look; alle anderen Zahlen bleiben Ghost-Buttons. Zurück und Weiter sind an den Rändern deaktiviert.

Aktuelle Seite: 5 von 12

Aus Einträgen berechnet

Mit pageSize gilt total als Anzahl der Einträge: 120 Einträge à 10 ergeben 12 Seiten. Ohne pageSize ist total direkt die Anzahl der Seiten.

Aktuelle Seite: 2 von 12

Mit getHref rendert jede Seite ein echtes <a>-Element mit aria-current auf der aktiven Seite; Zurück und Weiter verlinken die Nachbarseiten.

Größerer Bereich

siblingCount erweitert die sichtbaren Nachbarseiten links und rechts der aktiven Seite.