thymeleaf 实现分页功能

分页查询是一个很常见的功能,对于分页也有很多封装好的轮子供我们使用。

本文通过使用SpringBoot+Mybatis-plus 实现前端后端的分页功能,并没有使用插件来实现,前端主要是使用Thymeleaf来渲染分页的页码信息。

前段页面分页代码

    
    

      

        « Previous
      
      

        1
      

        Next »
      
    

• pageInfo.pageNum 根据自己的逻辑定义
• pageInfo.path 方便将整个分页片段引用到其他页面,如果不需要被引用,直接写死路径也可以

控制层Controller

  @RequestMapping("discuss/{userId}")
  public ModelAndView getIndexPage(
      PageInfo pageInfo,
      @RequestParam(name = "orderMode", defaultValue = "0") int orderMode) {
    ...
    ModelAndView mav = new ModelAndView();
    pageInfo = new PageInfo();
    page.setPath("user/discuss/" + userId);
    pageInfo.setPageNum(pageNum);
    // 这里把文章分类带到页面header实现动态加载分类
    IPage postIPage = postService.postPage(orderMode, pageNum);
    pageInfo.setTotal(postIPage.getTotal());
    pageInfo.setTotalPage(ObjUtils.toInteger(postIPage.getPages()));
    List records = postIPage.getRecords();
    pageInfo.setRows(records);
    List> discussPosts = new ArrayList<>();
    ...

    mav.addObject("pageInfo", pageInfo);
    mav.addObject("orderMode", orderMode);
    mav.addObject("discussPosts", discussPosts);
    mav.setViewName("site/my-post");
    return mav;
  }

page.setPath("user/discuss/" + userId); 路径最前边必须加入‘/’ ,如果仅是 user/discuss/,点击分页的时候会多出一层

https://localhost/user/discuss/user/discuss/2?pageNum=2

服务层service

public IPage postPage(Integer orderMode, Integer currentPage) {
    QueryWrapper wrapper = new QueryWrapper<>();
    if (orderMode != 0) {
      wrapper.eq("a", orderMode);
    }
    wrapper.orderByDesc("score", "created");
    // 第1页，每页2条
    Page page = new Page<>(currentPage, POSTSIZE);
    IPage postIPage = postMapper.selectPage(page, wrapper);
    // 获取当前数据
    return postIPage;
  }

数据访问层mapper

@Repository
public interface PostMapper extends BaseMapper {

}

获取pageInfo工具类

关注我获取更多干货