vue实现简易分页器，当 点击第2页时出现上一页的功能

实现简易分页器，可以使用 `v-for` 循环生成页码按钮，然后给每个按钮绑定点击事件，点击时可以通过页码切换内容。以下是一个简单的实现示例：

<template>
  <div class="pagination">
    <button @click="onPrevPage">上一页</button>
    <button v-for="page in pageCount" :key="page" @click="onPageClick(page)"
            :class="{ active: page === currentPage }">{{ page }}</button>
    <button @click="onNextPage">下一页</button>
  </div>
</template>

<script>
export default {
  name: 'Pagination',
  props: {
    total: {
      type: Number,
      required: true,
    },
    pageSize: {
      type: Number,
      default: 10,
    },
  },
  data() {
    return {
      currentPage: 1,
    };
  },
  computed: {
    pageCount() {
      return Math.ceil(this.total / this.pageSize);
    },
  },
  methods: {
    onPageClick(page) {
      this.currentPage = page;
      // TODO: 切换内容
    },
    onPrevPage() {
      if (this.currentPage > 1) {
        this.currentPage -= 1;
        // TODO: 切换内容
      }
    },
    onNextPage() {
      if (this.currentPage < this.pageCount) {
        this.currentPage += 1;
        // TODO: 切换内容
      }
    },
  },
}
</script>

<style scoped>
.pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.pagination button {
  margin: 0 5px;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 3px;
  cursor: pointer;
}

.pagination button.active {
  font-weight: bold;
}
</style>

在以上代码中，我们使用 `v-for` 循环生成页码按钮，并给每个按钮绑定点击事件。在点击事件中，我们可以通过改变 `currentPage` 的值来切换当前页码，并且可以在 `onPrevPage` 和 `onNextPage` 方法中判断是否可以切换到上一页或下一页。至于切换内容的具体实现，可以根据你的具体需求来进行编写。