Необходимо сделать пагинацию в таблице отдельным компонентом.
При передачи props в консоле предупреждение:
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "page"
и код и не отрабатывает.
Родительский компонент :
<v-data-table
:page.sync="page"
>
</v-data-table>
<template #footer="{props}">
<PaginationTableVue
:page="page"
/>
</template>
Дочерний компонент:
<v-pagination
v-model="localPage"
></v-pagination>
export default {
name: 'PaginationTableVue',
props: ['page'],
data: () => ({
localPage: this.page
}),
computed: {
localPage: {
get () {
return this.page
},
set (localPage) {
this.page = localPage
}
}
}
