mybatisplus分页查询前端代码

前端代码一般使用 Vue.js 或 React.js 来实现，以下是一个使用 Vue.js 的例子：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Age</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in list" :key="item.id">
          <td>{{ item.id }}</td>
          <td>{{ item.name }}</td>
          <td>{{ item.age }}</td>
        </tr>
      </tbody>
    </table>
    <div>
      <button @click="prevPage">上一页</button>
      <span>第 {{ currentPage }} 页</span>
      <button @click="nextPage">下一页</button>
    </div>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  data() {
    return {
      list: [],
      currentPage: 1,
      pageSize: 10,
      total: 0
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    getList() {
      axios.get('/api/user/list', {
        params: {
          page: this.currentPage,
          size: this.pageSize
        }
      }).then(res => {
        this.list = res.data.records
        this.total = res.data.total
      })
    },
    prevPage() {
      if (this.currentPage > 1) {
        this.currentPage--
        this.getList()
      }
    },
    nextPage() {
      if (this.currentPage < Math.ceil(this.total / this.pageSize)) {
        this.currentPage++
        this.getList()
      }
    }
  }
}
</script>

以上代码实现了一个简单的用户列表页面，当用户点击上一页或下一页按钮时，会发送请求到后端接口获取对应的数据并进行展示。其中，currentPage 表示当前页码，pageSize 表示每页显示的条数，total 表示总条数，list 表示当前页的数据列表。后端接口的请求参数中，page 表示当前页码，size 表示每页显示的条数，这些参数需要根据具体的后端接口实现进行调整。