vue filters 分页

在Vue中实现分页功能，你可以结合计算属性和过滤器来实现。下面是一个简单的示例：

首先，你需要有一个数据数组，例如：`items`，以及每页显示的数量，例如：`perPage`。

然后，你可以创建一个计算属性来计算总页数：

data() {
  return {
    items: [/* 数据数组 */],
    perPage: 10, // 每页显示的数量
    currentPage: 1 // 当前页数
  }
},
computed: {
  totalPages() {
    return Math.ceil(this.items.length / this.perPage);
  },
  paginatedItems() {
    // 计算当前页应该显示的数据
    const start = (this.currentPage - 1) * this.perPage;
    const end = start + this.perPage;
    return this.items.slice(start, end);
  }
}

在这个示例中，`totalPages` 计算属性用来获取总页数，并且 `paginatedItems` 计算属性用来获取当前页应该显示的数据。

接下来，你可以在模板中使用过滤器来显示分页后的数据：

<div v-for="item in paginatedItems" :key="item.id">
  {{ item.name }}
</div>

<!-- 显示分页导航 -->