mybatis-plus分页查询的数据在vue中怎么取

在Vue中，可以使用axios或者fetch等库从后台获取数据。如果使用mybatis-plus分页查询，需要在后台接口中使用Page对象进行分页查询，并将查询结果返回给前端。返回的结果中应包含当前页数、每页记录数、总记录数以及数据列表。在Vue中，可以使用v-for指令遍历数据列表并渲染到页面中。同时，可以使用pagination等组件实现分页功能，用户可以通过点击页码或者输入页数等方式切换页面。具体实现可以参考以下代码：

// 后台接口代码示例
@GetMapping("/users")
public Result<Page<User>> getUsers(@RequestParam(defaultValue = "1") Integer pageNum,
                                   @RequestParam(defaultValue = "10") Integer pageSize) {
    Page<User> page = new Page<>(pageNum, pageSize);
    Page<User> userPage = userService.page(page);
    return Result.success(userPage);
}

// Vue组件代码示例
<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>姓名</th>
          <th>年龄</th>
          <th>性别</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="user in users" :key="user.id">
          <td>{{ user.id }}</td>
          <td>{{ user.name }}</td>
          <td>{{ user.age }}</td>
          <td>{{ user.gender }}</td>
        </tr>
      </tbody>
    </table>
    <pagination :current="currentPage" :total="total" :page-size="pageSize" @change="handlePageChange"></pagination>
  </div>
</template>

<script>
import axios from 'axios'
import pagination from '@/components/pagination'

export default {
  name: 'UserList',
  components: { pagination },
  data() {
    return {
      users: [],
      currentPage: 1,
      pageSize: 10,
      total: 0
    }
  },
  mounted() {
    this.getUsers()
  },
  methods: {
    getUsers() {
      axios.get('/api/users', { params: { pageNum: this.currentPage, pageSize: this.pageSize } })
        .then(res => {
          this.users = res.data.records
          this.total = res.data.total
        })
        .catch(err => {
          console.error(err)
        })
    },
    handlePageChange(page) {
      this.currentPage = page
      this.getUsers()
    }
  }
}
</script>

在这个示例中，我们通过axios库从后台获取用户数据，并将数据渲染到页面中。同时，使用pagination组件实现分页功能，用户可以通过点击页码或者输入页数等方式切换页面。在handlePageChange方法中，我们更新了当前页数并重新调用getUsers方法获取当前页的数据。