Привет. мне кажется, что опора md-size для md-table-pagination не влияет на количество строк в md-table.
то есть: у меня есть 20 строк для отображения в md-таблице
data() {
return {
rows: [
{id: 1, name: "Record #1 name", isEnabled: true},
{id: 2, name: "Record #2 name", isEnabled: false},
// ...
{id: 20, name: "Record #20 name", isEnabled: true},
]
}
}
затем я создаю md-таблицу следующим образом:
<md-table-card>
<md-toolbar>
<h2 class="md-title">Records list</h2>
<md-button class="md-icon-button">
<md-icon>add_circle_outline</md-icon>
</md-button>
<md-button class="md-icon-button">
<md-icon>edit_circle_outline</md-icon>
</md-button>
<md-button class="md-icon-button">
<md-icon>delete</md-icon>
</md-button>
</md-toolbar>
<md-table md-sort="id" md-sort-type="desc" @sort="onSort">
<md-table-header>
<md-table-row>
<md-table-head md-sort-by="id"><md-icon>format_list_numbered</md-icon><span>ID</span></md-table-head>
<md-table-head md-sort-by="name">Record name</md-table-head>
<md-table-head md-sort-by="isEnabled">Is Enabled</md-table-head>
</md-table-row>
</md-table-header>
<md-table-body>
<md-table-row v-for="(row, rowIndex) in rows" :key="rowIndex" :md-item="row">
<md-table-cell md-numeric>{{row.id}}</md-table-cell>
<md-table-cell>{{row.name}}</md-table-cell>
<md-table-cell><md-switch v-model="row.isEnabled"></md-switch></md-table-cell>
</md-table-row>
</md-table-body>
</md-table>
<md-table-pagination
:md-size="5"
:md-total="rows.length"
md-page="1"
:md-page-options="[5, 10, 25, 50]"
@pagination="onPagination">
</md-table-pagination>
</md-table-card>
Но количество строк в таблице равно всем строкам в data ().
И если я изменю «размер» в пейджере, это не повлияет на количество отображаемых строк.
Это нужно делать вручную. Md-table запускает события только тогда, когда пользователь взаимодействует с самой таблицей.
Почему? Потому что я не могу угрожать вашим данным. Ваши данные могут иметь много разных форматов. Таким образом, вы должны создать (возможно, на своей стороне сервера) логику разбивки на страницы, чтобы обновить переменную v-for
с новыми настройками страницы (в вашем случае переменная rows
.
Спасибо.
Я думаю, дело в том, что если у меня 6 строк в моих данных, а размер установлен на 5, я не должен видеть 6 страниц данных, я должен видеть 2. Вы знаете сумму и размер, поэтому делай деление.
@ jdrake3 вы можете изменить размер пагинации с помощью простого if