Pagination
Cursor-basiertes Blättern für die APIs der Konsole: „Mehr laden“ oder zurück und weiter.
function LoadMore() {
const [n, setN] = useState(50);
return <Pagination hasMore={n < 200} onLoadMore={() => setN((x) => Math.min(200, x + 50))} />;
}import { Pagination } from "@logicplanes/kaeso-ui";Props
hasMorebooleanOb es eine nächste Seite gibt.
hasPreviousbooleanOb es eine vorherige Seite gibt.
loadingbooleanZeigt, dass eine Seite lädt.
onLoadMore(() => void)Wird vom Button „Mehr laden“ aufgerufen.
onNext(() => void)Wird aufgerufen, um zur nächsten Seite zu wechseln.
onPageChange((page: number) => void)Wird mit der gewählten Seitenzahl aufgerufen.
onPrevious(() => void)Wird aufgerufen, um zur vorherigen Seite zu wechseln.
pagenumber = 1Seiten:
pageCountnumber = 1Die Anzahl der Seiten, für nummerierte Seiten.
variant"cursor" | "load-more" | "pages" = load-moreNummerierte Seiten, zurück und weiter per Cursor oder ein Button „Mehr laden“.