I have a page with Vuetify DataTable component (Vuetify 1.5.7) and using default component's pagination. I set the 'Rows per page' select values using the :rows-per-page-items property.
Now I want to set initial value from this rows-per-page-items array (not only the first one!) when entering the page.
Is it possible and how can I do this?
Example code of table is shown below:
<v-data-table
:headers="headers"
:items="equipment"
class="elevation-1"
:rows-per-page-items='[15, 30, 50, 100]'>
<template v-slot:items="props">
<td>{{ props.item.name }}</td>
</template>
</v-data-table>
Use the pagination.sync to control pagination:
<v-data-table
:headers="headers"
:items="equipment"
class="elevation-1"
:rows-per-page-items="[15, 30, 50, 100]"
:pagination.sync="pagination">
<template v-slot:items="props">
<td>{{ props.item.name }}</td>
</template>
</v-data-table>
...
data() {
return {
pagination: {
rowsPerPage: 30
}, ...
}
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments