我想要实现一个查询分页功能，请写一个前端是vue后端是java的例子

好的，以下是一个简单的前端Vue和后端Java的查询分页功能示例：

前端Vue代码：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(user, index) in users" :key="index">
          <td>{{ user.id }}</td>
          <td>{{ user.name }}</td>
          <td>{{ user.email }}</td>
        </tr>
      </tbody>
    </table>

    <div class="pagination">
      <button @click="prevPage" :disabled="page <= 1">Prev</button>
      <span>Page {{ page }} of {{ totalPages }}</span>
      <button @click="nextPage" :disabled="page >= totalPages">Next</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      users: [],
      page: 1,
      totalPages: 0
    };
  },
  mounted() {
    this.fetchUsers();
  },
  methods: {
    fetchUsers() {
      axios.get(`/users?page=${this.page}`).then(response => {
        this.users = response.data.users;
        this.totalPages = response.data.totalPages;
      });
    },
    nextPage() {
      this.page++;
      this.fetchUsers();
    },
    prevPage() {
      this.page--;
      this.fetchUsers();
    }
  }
};
</script>

后端Java代码：

@RestController
@RequestMapping("/users")
public class UserController {
  @Autowired
  private UserRepository userRepository;

  @GetMapping
  public Page<User> getUsers(@RequestParam(defaultValue = "0") int page) {
    Pageable pageable = PageRequest.of(page, 10);
    return userRepository.findAll(pageable);
  }
}

这个例子假设你有一个名为User的模型，并且你已经在后端创建了一个名为UserRepository的JPA仓库。在前端，我们使用axios库来进行HTTP请求。在这个例子中，我们每页显示10个用户，并且我们可以使用“Next”和“Prev”按钮来浏览不同的页面。