Тема
Пейджинг и виртуализация
paging выбирает способ отображения уже переданной локальной коллекции:
| Режим | Поведение |
|---|---|
pages | Делит строки на страницы и показывает навигацию |
virtual | Показывает единый прокручиваемый список с виртуальным окном |
Локальные страницы
pages используется по умолчанию.
vue
<Table
id="orders"
:rows="rows"
row-key="id"
paging="pages"
page-size="25"
page-sizes="10,25,50,100"
>
<Column key="number" title="Номер" sortable />
<Column key="createdAt" title="Создан" sortable sort="date" />
</Table>Runtime сначала сортирует полную коллекцию, затем выбирает строки текущей страницы. Смена размера возвращает пользователя на первую страницу. При сокращении rows номер страницы автоматически ограничивается существующим диапазоном.
pageChanged содержит:
ts
{
tableId: string
pageIndex: number // начинается с 0
pageSize: number
pageCount: number
}Начальная гидратация сохранённого состояния событие не публикует.
Единый виртуальный список
vue
<Table
id="orders"
:rows="rows"
row-key="id"
paging="virtual"
row-size="40"
>
<Column key="number" title="Номер" />
<Column key="status" title="Статус" />
</Table>В режиме virtual:
- отсутствуют страницы и footer навигации;
- сортировка применяется ко всей коллекции;
- одновременно материализуется только видимое окно и overscan;
page-sizeиpage-sizesне влияют на отображение;rowIndexостаётся индексом полной отсортированной коллекции.
row-size задаёт расчётную высоту строки. Сильно отличающаяся фактическая высота может ухудшить точность прокрутки конкретного адаптера.
lazy
Текущее ограничение
lazy пока не отправляет запросы, не передаёт limit/offset, не принимает общее количество строк и не переводит Table в manual pagination.
Даже при lazy коллекция rows считается полной локальной выборкой. Серверный paging должен быть отдельным контрактом Query/DataView и не может считаться реализованным только из-за наличия этого атрибута.