数据访问-crud实验-分页数据展示

1、添加一个MybatisController实现分页功能

@Configuration
public class MybatisConfig  {
        // 设置请求的页面大于最大页后操作， true调回到首页，false 继续请求  默认false
        // paginationInterceptor.setOverflow(false);
        // 设置最大单页限制数量，默认 500 条，-1 不受限制
        // paginationInterceptor.setLimit(500);
        // 开启 count 的 join 优化,只针对部分 left join
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor() {
        MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
        PaginationInnerInterceptor paginationInnerInterceptor = new PaginationInnerInterceptor();

        paginationInnerInterceptor.setOverflow(true);
        paginationInnerInterceptor.setMaxLimit(500L);
        interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.H2));
        return interceptor;
    }
}

2、

<tbody role="alert" aria-live="polite" aria-relevant="all">
<tr class="gradeX" th:each="user,stat:${page.records}">
    <td th:text="${stat.count}">Trident</td>
    <td th:text="${user.id}">X</td>
    <td class=" " th:text="${user.name}">Internet</td>
    <td class=" " th:text="${user.age}"></td>
    <td>[[${user.email}]]</td>
</tr>
</tbody>

/*
* Create a se**quence (**array) of integer numbers going，生成一个数字序列
* from

3、修改html，其中th:class="{num == page.current?'active':''}" 的意思是三元句判断当前页是否一致，th:each="num:{#numbers.sequence(1,page.pages)}的意思是将页码从一开始弄出来

<div class="row-fluid">
    <div class="span6">
        <div class="dataTables_info" id="dynamic-table_info">当前第 [[${page.current}]] 页 总计 [[${page.pages}]] 页 共 [[${page.total}]]
            条记录
        </div>
    </div>
    <div class="span6">
        <div class="dataTables_paginate paging_bootstrap pagination">
            <ul>
                <li class="prev disabled"><a href="#">← Previous</a></li>
                <li th:class="${num == page.current?'active':''}" th:each="num:${#numbers.sequence(1,page.pages)}">
                    <a th:href ="@{/dynamic_table(pn=${num})}">[[${num}]]</a></li>
                   
                <li class="next"><a href="#">Next → </a></li>
            </ul>
        </div>
    </div>
</div>