v-data-table
有一个 top
插槽,带有 pagination
prop 的结构与 footer
的结构匹配投币口。是否可以分配 top
插槽引用相同的(大概是 v-pagination
)控制 footer
正在使用?
我的目标是复制表格顶部的分页控件(位于页脚中)。
最佳答案
事实上,v-data-table
中默认显示的控件页脚插槽正常(公共(public) - 非内部)Vuetify 组件 v-data-footer
.您可以像这样轻松地将其添加到顶部插槽中:
<div id="app">
<v-app id="inspire">
<v-data-table
v-model="selected"
:headers="headers"
:items="desserts"
:items-per-page="5"
:single-select="true"
item-key="name"
show-select
class="elevation-1"
>
<template v-slot:top="{ pagination, options, updateOptions }">
<v-data-footer
:pagination="pagination"
:options="options"
@update:options="updateOptions"
items-per-page-text="$vuetify.dataTable.itemsPerPageText"/>
</template>
</v-data-table>
</v-app>
</div>
Demo
关于vue.js - 验证 : Show pagination controls at the top of my v-data-table as well as in the footer,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59759939/