SpringBoo集成PageHelper+thymeleaf 显示到页面

最新推荐文章于 2022-09-06 17:01:32 发布

尔等同学

最新推荐文章于 2022-09-06 17:01:32 发布

阅读量1k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_41852212/article/details/97074082

SpringBoot 专栏收录该内容

19 篇文章

订阅专栏

本文详细介绍了如何在SpringBoot项目中使用PageHelper实现分页功能，包括配置步骤、SQL编写技巧及Thymeleaf集成等关键内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

昨天，完成了PageHelper的分页并显示到了前端页面。遇到了一些坑和需要注意的地方，特此记录，如有不正之术，还请指出。谢谢。

编译器：idea

管理工具：maven

数据管理：mybatis

SpringBoo集成PageHelper

1、添加jar包

        <!--引入pageHelper分页插件 -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>2.0.0</version>
        </dependency>
        <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper-spring-boot-starter</artifactId>
            <version>1.2.10</version>
        </dependency>

这应该是近期比较稳定的版本，pageHelper也会出现类似版本不对就出现莫名其妙的错。

2、启动类中添加配置

    @Bean
    public PageHelper pageHelper() {
        System.out.println("MyBatisConfiguration.pageHelper()");
        PageHelper pageHelper = new PageHelper();
        Properties p = new Properties();
        p.setProperty("offsetAsPageNum", "true");
        p.setProperty("rowBoundsWithCount", "true");
        p.setProperty("reasonable", "true");
        pageHelper.setProperties(p);
        return pageHelper;
    }

#控制台输出sql语句
logging.level.com.wb.oss.mapper=debug

上面这条语句是昨天看到的，实测有用。（添加到这个中）

3、编写SQL语句

实体类

@Data 是lombok 插件的一个注解,可以自动生成get、set、toString 方法，很实用。

Mapper 中：

List<OssOb> selectByExample(OssObExample example);

Mapper.xml中：

<select id="selectByExample" parameterType="com.wb.oss.bean.OssObExample" resultMap="BaseResultMap">
  select
  <if test="distinct">
    distinct
  </if>
  <include refid="Base_Column_List" />
  from oss_ob
  <if test="_parameter != null">
    <include refid="Example_Where_Clause" />
  </if>
  <if test="orderByClause != null">
    order by ${orderByClause}
  </if>
</select>

Service层调用

public  List<OssOb> select()
{
    return ossObMapper.selectByExample(null);
}

selectByExample 当传入的值为null时，自动返回所有当前对象组成的List。

Controller层调用

    @RequestMapping("/list")
    public String OssObList(@RequestParam(defaultValue = "1")Integer pageNum,
                            @RequestParam(defaultValue="2")Integer pageSize,
                            Model model) {

        Page p= PageHelper.startPage(pageNum,pageSize);
        //传入从第几页查询，每页查几条
        List<OssOb> obList = obList=ossObService.select();
        //查询中最好只有一次查询，不要进行多次查询，pageHelper 默认操作第一次查询的结果集
        PageInfo info=new PageInfo(obList);
        //将List转换为pageInfo对象，这样可以更方便的在页面中进行分页操作。
        model.addAttribute("pageInfo",info);
        return "list";
    }

注意，查询得到的list应该必须是从数据库中得到的数据，而不是自己new的一个List或者是其他的数据来源。

个人猜测如下：

因为pageHelper 是配合Mybatis使用的，如果是自己new的一个List起不到查询的作用。

我曾试着将自己新建的List传入pageInfo 中，这样查出来的数据只能全部显示到一页上，无法进行分页操作。

4、集成thymeleaf

首先导入相应的jar包，要不然容易报莫名其妙的错。

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

配置文件中加上

spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.servlet.content-type=text/html
spring.thymeleaf.encoding=utf-8
spring.thymeleaf.cache=false
spring.mvc.static-path-pattern=/**
spring.resources.static-locations=classpath:/static/
spring.thymeleaf.mode=HTML

html的模板引擎为：

<html xmlns:th="http://www.thymeleaf.org">

html：

<div class="row">
        <div class="col-md-12">
            <table class="table table-hover" id="dataTable1">
                <tr>
                    <th>文件名</th>
                    <th>上传时间</th>
                    <th>上传者id</th>
                    <th>操作</th>
                </tr>
                <tr th:each="oss:${pageInfo.list}">
                    <td th:text="${oss.obName}"></td>
                    <td th:text="${oss.updateTime}"></td>
                    <td th:text="${oss.obUploaduser}"></td>
                    <th>
                        <a class="btn btn-default" href="index.html" role="button">
                            <span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span>
                            下载</a>
                        <a class="btn btn-default" href="index.html" role="button">
                            <span class="glyphicon glyphicon-floppy-remove" aria-hidden="true"></span>
                            删除</a>
                    </th>
                </tr>
            </table>
        </div>
    </div>
    <!-- 显示分页信息 -->
    <div class="row">
        <!--分页文字信息  -->
        <div class="col-md-6">当前<span th:text="${pageInfo.pageNum }"></span>页,
            总<span th:text="${pageInfo.pages}"></span>页,
            总 <span th:text="${pageInfo.total}"></span>条记录
        </div>
        <!-- 分页条信息 -->
        <div class="col-md-6">
            <nav aria-label="Page navigation">
                <ul class="pagination">
                    <li th:if="${pageInfo.hasPreviousPage}">
                        <a th:href="'/list?pageNum=1'">首页</a>
                    </li>
                    <li class="prev" th:if="${pageInfo.hasPreviousPage}">
                        <a th:href="'/list?pageNum='+${pageInfo.prePage}">
                            <i class="ace-icon fa fa-angle-double-left"></i>
                            上一页
                        </a>
                    </li>
                    <li class="next" th:if="${pageInfo.hasNextPage}">
                        <a th:href="'/list?pageNum='+${pageInfo.nextPage}" >
                            <i class="ace-icon fa fa-angle-double-right"></i>
                            下一页
                        </a>
                    </li>
                    <li>
                        <a th:href="'/list?pageNum='+${pageInfo.pages}">尾页</a>
                    </li>

                </ul>
            </nav>
        </div>
    </div>



<hr/>
    <div>当前页号：<span th:text="${pageInfo.pageNum}"></span></div>
    <div>每页条数：<span th:text="${pageInfo.pageSize}"></span></div>
    <div>起始行号：<span th:text="${pageInfo.startRow}"></span></div>
    <div>终止行号：<span th:text="${pageInfo.endRow}"></span></div>
    <div>总结果数：<span th:text="${pageInfo.total}"></span></div>
    <div>总页数：<span th:text="${pageInfo.pages}"></span></div>
    <hr/>
    <div>是否为第一页：<span th:text="${pageInfo.isFirstPage}"></span></div>
    <div>是否为最后一页：<span th:text="${pageInfo.isLastPage}"></span></div>
    <div>是否有前一页：<span th:text="${pageInfo.hasPreviousPage}"></span></div>
    <div>是否有下一页：<span th:text="${pageInfo.hasNextPage}"></span></div>

测试：