Lewati ke konten

Pagination - Vue

Pagination

banner-background
import { Pagination } from '@idds/vue';
NameTypeDefaultRequiredDescription
modelValue?number1NoHalaman saat ini (v-model, 1-indexed).
totalPages?number1NoTotal jumlah halaman.
pageSize?number10NoJumlah baris per halaman saat ini.
pageSizeOptions?number[][10, 20, 50]NoOpsi-opsi jumlah baris per halaman.
maxVisiblePages?number3NoMaksimal jumlah halaman yang terlihat.
showPageSize?booleantrueNoTampilkan dropdown page size.
fullWidth?booleanfalseNoFull width layout dengan justify-between (untuk Table).
disabled?booleanfalseNoDisable semua kontrol.
size?'sm' | 'md' | 'lg''md'NoSize variant.
variant?'default' | 'bordered' | 'filled''default'NoVariant style.
ariaLabel?string'Pagination navigation'NoAria label.
previousLabel?string'Previous page'NoLabel untuk tombol previous.
nextLabel?string'Next page'NoLabel untuk tombol next.
@update:modelValue?(page: number) => voidNoEvent saat halaman berubah.
@change?(page: number) => voidNoEvent saat halaman berubah.
@page-size-change?(size: number) => voidNoEvent saat page size berubah.