Pagination
Базовый
Страница: 1
С большим количеством страниц
Из total и pageSize
Размеры
Входные параметры
| Имя | Тип | По умолчанию | Описание |
|---|---|---|---|
modelValue | number | 1 | Текущая страница (начиная с 1). |
pageCount | number | undefined | Количество страниц. Приоритетнее, чем total. |
total | number | undefined | Общее количество элементов (количество страниц вычисляется как ceil(total / pageSize)). |
pageSize | number | 10 | Элементов на странице. |
siblingCount | number | 1 | Сколько соседних страниц показывать вокруг текущей. |
boundaryCount | number | 1 | Сколько страниц показывать у краёв. |
size | 'sm' | 'md' | 'lg' | 'md' | Размер пагинации. |
v-model
Проп modelValue связывается через v-model и представляет текущую страницу.
События
| Имя | Аргументы | Когда срабатывает |
|---|---|---|
update:modelValue | page: number | При переходе на другую страницу. |
page-change | page: number | Аналогично update:modelValue — уведомление о смене страницы. |
Описание
Компонент C3Pagination отображает нумерацию страниц с кнопками «предыдущая»/«следующая» и эллипсами при большом количестве страниц. Управляется через v-model.
Количество страниц задаётся либо напрямую пропом pageCount, либо вычисляется из total и pageSize. Используйте его для постраничной разбивки списков и таблиц.
Дополнительная информация
- Кнопка «назад» отключена на первой странице, «вперёд» — на последней.
- Переход на текущую страницу не эмитит событий.
- Эллипсы выводятся элементами
<span>сaria-hidden="true". - Активная страница помечена
aria-current="page"; каждая кнопка имеетaria-labelс номером страницы; навигация обёрнута в<nav aria-label="Пагинация">.