Buefy分页更改事件问题

Question

我是vue的新手，目前正在尝试使用buefy库来使用分页来一次获取有限数量的行，以提高页面加载性能。这是我的大部分代码。

<template>
  <div id="app">
    <b-table
      :data="filter_list"
      :paginated="isPaginated"
      :row-key="(f) => f.id"
      :per-page="25"
      :current-page="currentPage"
      :pagination-simple="isPaginationSimple"
      :pagination-position="paginationPosition"
      :default-sort-direction="defaultSortDirection"
      :sort-icon="sortIcon"
      :sort-icon-size="sortIconSize"
      default-sort="version"
      aria-next-label="Next page"
      aria-previous-label="Previous page"
      aria-page-label="Page"
      aria-current-label="Current page"
      @change="getRows"
    />
  </div>
</template>

<script>
import data from "./data";

export default {
  name: "App",
  data() {
    return {
      filter_list: data,
      isPaginated: true,
      isPaginationSimple: true,
      paginationPosition: "bottom",
      defaultSortDirection: "desc",
      sortIcon: "arrows-v",
      sortIconSize: "is-small",
      currentPage: 1,
      perPage: 10,
      totalPages: 0,
    };
  },
  components: {},
  computed: {},
  methods: {
    getRows(currentPage) {
      console.log(currentPage.currentPage);
      // call rest api here with the current page number and push the response
      // into filter_list

    },
  },
  mounted() {},
};
</script>

这是实时代码沙箱https://codesandbox.io/s/suspicious-lichterman-6n4ep?file=/src/App.vue:0-1254。

我想触发getRows方法，然后触发其中的rest API请求，以获取特定页面的所有行。被请求的API内置了页码和总页数的逻辑。它将页码作为参数，并返回25行(也是一个参数)数据。

当我点击下一页/上一页的箭头时，我没有看到getRows方法被触发，主要是需要帮助。我主要指的是https://buefy.org/documentation/pagination/，我不太确定我在这里做错了什么。

Answer 1

buetify表没有change事件，但有page-change

...
@page-change="getRows"
...
getRows(currentPage) {
  console.log(currentPage);
},