vue-tables-2 分页不限制每页数量

Question

我在我的 vue 应用程序中使用 vue-tables-2 作为数据表。
vue-tables-2: ^1.4.70
视图：^2.6.10
一切都很好，除了每页显示的项目受到选项对象上 perPage 的限制。
这里我有 5 条记录，我已将每页选项设置为 2。但它不起作用并且每页仍显示 5 条记录。另外，当我点击第二页时注意到变化！
这是我的代码：

tickets.vue:

<template>
    <v-server-table url="/panel/tickets/data" :columns="columns" :options="options"></v-server-table>
</template>
<script>
    export default ({
        name: 'ticketTable',
        data() {
            return {
                columns: ['subject', 'status', 'department', 'date'],
                options: {
                    responseAdapter(data) {
                        return {
                            data,
                            count: data.length
                        }
                    },
                    headings: {
                        subject: 'موضوع',
                        status: 'وضعیت',
                        department: 'دپارتمان',
                        date: 'تاریخ ایجاد'
                    },
                    perPage: 2,
                    pagination: {
                        edge: false,
                        dropdown: false,
                        chunk: 2
                    },
                    filterable: true,
                    sortable: 'subject',
                }
            }
        }
    });
</script>

app.js:

import ticketTable from './components/tickets';
import {ServerTable} from 'vue-tables-2';

Vue.use(ServerTable, {
    texts: {
        count: "نمایش {from} تا {to} از {count} رکورد",
        first: 'اولین',
        last: 'آخرین',
        filter: "جستجو : ",
        filterPlaceholder: "جستجو",
        limit: "رکورد:",
        page: "صفحه:",
        noResults: "هیچ نتیجه ای یافت نشد",
        filterBy: "فیلتر با {column}",
        loading: 'در حال آماده سازی...',
        defaultOption: 'انتخاب {column}',
        columns: 'ستون ها'
    }
});

html:

<section class="mt-4 mb-4">
                <div class="section-title">
                    <h4 class="mb-0">لیست تمام تیکت ها</h4>
                </div>
                <div class="section-content">
                    <ticket-table></ticket-table>
                </div>
            </section>

这是我的结果：

任何帮助表示赞赏。

Answer 1

服务器端方法：
我刚刚意识到，每次我们单击分页编号时，它都会为服务器发送页码和每页编号的项目，并作为响应获得新的数据数组。静态数据方式：
如果我们在 js 本身中定义我们的数据，table 将处理分页，因为它知道页码和每页的项目。
在 data tables 加载数据的最佳实践是使用服务器端方法，因为如果我们有太多数据，它会影响页面加载时间。

vue-tables-2 分页不限制每页数量

vue-tables-2 pagination doesn't limit per page amount

javascript

vue.js

vuejs2

vue-tables-2