使用vue写个分页器

在Vue中实现分页功能，可以通过以下步骤实现：

1. 定义分页数据：在Vue的data中定义当前页数、每页数据量、总数据量等分页数据。

2. 实现分页逻辑：在Vue的methods中实现分页逻辑，如更改当前页数、计算总页数等。

3. 渲染分页组件：在Vue的template中渲染分页组件，如上一页、下一页、页码等。

4. 绑定事件：在Vue的template中绑定分页组件的事件，如点击上一页、下一页等触发的事件处理函数。

下面是一个简单的Vue分页示例：

<template>
  <div>
    <button @click="prevPage">上一页</button>
    <button @click="nextPage">下一页</button>
    <span>当前页：{{currentPage}}</span>
    <span>总页数：{{totalPage}}</span>
  </div>
</template>

<script>
export default {
  data() {
    return {
      currentPage: 1,
      perPage: 10,
      total: 100
    };
  },
  computed: {
    totalPage() {
      return Math.ceil(this.total / this.perPage);
    }
  },
  methods: {
    prevPage() {
      if (this.currentPage > 1) {
        this.currentPage--;
      }
    },
    nextPage() {
      if (this.currentPage < this.totalPage) {
        this.currentPage++;
      }
    }
  }
};
</script>

该示例实现了分页器的基本功能，您可以根据自己的需求进一步扩展它。