使用vue写一个分页table页

好的，以下是一个使用Vue写的分页table页的示例代码：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="user in displayedUsers" :key="user.id">
          <td>{{ user.id }}</td>
          <td>{{ user.name }}</td>
          <td>{{ user.email }}</td>
        </tr>
      </tbody>
    </table>
    <div class="pagination">
      <button :disabled="currentPage === 1" @click="prevPage">Prev</button>
      <span>{{ currentPage }} / {{ totalPages }}</span>
      <button :disabled="currentPage === totalPages" @click="nextPage">Next</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      users: [
        { id: 1, name: "John", email: "john@example.com" },
        { id: 2, name: "Jane", email: "jane@example.com" },
        { id: 3, name: "Bob", email: "bob@example.com" },
        { id: 4, name: "Alice", email: "alice@example.com" },
        { id: 5, name: "Tom", email: "tom@example.com" },
        { id: 6, name: "Lucy", email: "lucy@example.com" },
        { id: 7, name: "Mike", email: "mike@example.com" },
        { id: 8, name: "Mary", email: "mary@example.com" },
        { id: 9, name: "David", email: "david@example.com" },
        { id: 10, name: "Lisa", email: "lisa@example.com" }
      ],
      itemsPerPage: 3,
      currentPage: 1
    };
  },
  computed: {
    displayedUsers() {
      const startIndex = (this.currentPage - 1) * this.itemsPerPage;
      const endIndex = startIndex + this.itemsPerPage;
      return this.users.slice(startIndex, endIndex);
    },
    totalPages() {
      return Math.ceil(this.users.length / this.itemsPerPage);
    }
  },
  methods: {
    prevPage() {
      this.currentPage -= 1;
    },
    nextPage() {
      this.currentPage += 1;
    }
  }
};
</script>

该示例代码中，使用了一个 `users` 数组来存储所有的用户数据，每页显示 `itemsPerPage` 条数据，当前页数为 `currentPage`。在 `displayedUsers` 计算属性中，根据当前页数和每页显示条数计算出应该显示的数据。在 `totalPages` 计算属性中，根据用户数据总数和每页显示条数计算出总页数。在 `prevPage` 和 `nextPage` 方法中，分别更新当前页数，以实现翻页功能。最终将用户数据和分页组件渲染到页面上。