使用PageHelper和Pagination插件实现分页

1，导入PageHelper依赖

<!-- SpringBoot整合版 -->
<dependency>
    <groupId>com.github.pagehelper</groupId>
    <artifactId>pagehelper-spring-boot-starter</artifactId>
    <version>1.2.10</version>
</dependency>

2，application.yml配置文件配置

pagehelper:
  helper-dialect: mysql
  reasonable: true
  support-methods-arguments: true
  params: count=countSql

3，在ServiceImpl中使用

@Override
public PageInfo<User> selectAllUser(Integer pageNum, Integer pageSize,String keyword) {
    // 开启分页
    PageHelper.startPage(pageNum, pageSize);
    // 查询相关数据，这一步和分页没有半毛钱关系，这个分页插件属于无侵入式，很好用
    List<User> User = UserMapper.selectAllUser(keyword);
    // 封装到PageInfo对象中
    PageInfo<User> pageInfo = new PageInfo<>(User);
    return pageInfo;
}

4，handler方法

@RequestMapping("/to/portal")
public String toPortal( 
    ModelMap modelMap,
    @RequestParam(value="pageNum",defaultValue="1") Integer pageNum,
    @RequestParam(value="pageSize",defaultValue="5") Integer pageSize,
    @RequestParam(value="keyword",defaultValue="") String keyword) {
                       
    try {
        PageInfo<User> pageInfo = UserService.selectAllUser(pageNum,pageSize,keyword);
        modelMap.addAttribute("pageInfo", pageInfo);
        return "portal";
    } catch (Exception e) {
        modelMap.addAttribute("message",e.getMessage);
        return "portal";
    }
     
}

5，前端js方面，声明一个初始化方法，及其翻页执行的回调函数，这些代码可以直接复制就可以用，只需要改变location.href分页跳转的url。

// 声明一个函数用于初始化 Pagination
function initPagination(totalRecord,current_page,items_per_page){
             
        // 声明 Pagination 设置属性的 JSON 对象
        var properties = {
        num_edge_entries: 3, // 边缘页数
        num_display_entries: 5, // 主体页数
        callback: pageSelectCallback, // 用户点击“翻页”按钮之后执行翻页操作的回调函数
        current_page: current_page, // 当前页，pageNum 从 1 开始，必须-1 后才可以赋值
        prev_text: "上一页", 
        next_text: "下一页",
        items_per_page:items_per_page // 每页显示 1 项
        };
         
        // 给id为Pagination的div初始化分页导航条
        $("#Pagination").pagination(totalRecord, properties);
}

// initPagination方法中执行翻页的回调函数
function pageSelectCallback(pageIndex, jQuery){
        // pageIndex 是当前页页码的索引，相对于 pageNum 来说，pageIndex 比 pageNum 小 1
        var pageNum = pageIndex + 1;
        // 执行页面跳转也就是实现“翻页”
        window.location.href = "to/portal?pageNum="+pageNum;
        // 取消当前超链接的默认行为
        return false;
}

6，页面调用，及其分页导航条的初始化

$(function(){
    // 把以下几个参数准备好，传给初始化方法
    var totalRecord = [[${pageInfo.total}]];
    var current_page = [[${pageInfo.pageNum-1}]];
    var items_per_page = [[${pageInfo.pageSize}]];
    initPagination(totalRecord,current_page,items_per_page);
})

<!--这里是分页 -->
<div id="Pagination" style="text-align: center;" class="pagination"></div>

7，html页面需要添加的文件，注意js文件要放在jquery.min.js文件后面，因为这东西依赖jquery

<script type="text/javascript" src="jquery/jquery.pagination.js" charset="UTF-8"></script>
<link rel="stylesheet" href="css/pagination.css"/>