Thymeleaf 分页功能

效果

Thymeleaf 分页效果

使用方法

<div th:replace="~{common/pagination.html :: page(${page.current}, ${page.pages}, '/', 'page') }"></div>

page(current, pages, url, urlPara)

current 当前页
pages 总页数
url 请求url
urlPara 请求参数名称

分页代码

<th:block th:fragment="page(current, pages, url, urlPara)">
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
  <a th:if="${current>1}" class="pagination-previous" th:href="@{${url} + '?' + ${urlPara} + '=' + ${current - 1}}">上一页</a>
  <a th:if="${current} < ${pages}" class="pagination-next" th:href="@{${url} + '?' + ${urlPara} + '=' + ${current + 1}}">下一页</a>
  <a th:if="${current==1}" class="pagination-previous" disabled>上一页</a>
  <a th:if="${current} == ${pages}" class="pagination-next" disabled>下一页</a>
  <ul class="pagination-list">
    <li><a class="pagination-link" th:classappend="${current == 1} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=1'}" th:text="1">1</a></li>
  <th:block th:if="${current<6 && current != pages}" th:each="i: ${#numbers.sequence(2, 10)}">
    <li><a class="pagination-link" th:classappend="${current == i} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=' + ${i}}" th:text="${i}"></a></li>
  </th:block>
    <li th:if="${current>5}"><span class="pagination-ellipsis">&hellip;</span></li>
  <th:block th:if="${current>5 && ((pages - current)>5)}">
    <li th:each="i: ${#numbers.sequence(current - 4,current + 4)}"><a class="pagination-link" th:classappend="${current == i} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=' + ${i}}" th:text="${i}"></a></li>
  </th:block>
  <th:block th:if="${(pages - current) < 6}"><th:block th:each="index : ${#numbers.sequence(1, 5)}"><th:block th:if="${(pages - current) == index}" th:each="i: ${#numbers.sequence(current - 4 - (5 - index), pages - 1)}">
    <li><a class="pagination-link" th:classappend="${current == i} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=' + ${i}}" th:text="${i}"></a></li>
  </th:block></th:block></th:block>
  <th:block th:if="${current == pages}" th:each="i: ${#numbers.sequence(current - 9, current - 1)}">
    <li><a class="pagination-link" th:classappend="${current == i} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=' + ${i}}" th:text="${i}"></a></li>
  </th:block>
    <li th:if="${pages - current} > 5"><span class="pagination-ellipsis">&hellip;</span></li>
    <li><a class="pagination-link" th:classappend="${current == pages} ? 'is-current'" th:href="@{${url} + '?' + ${urlPara} + '=' + ${pages}}" th:text="${pages}"></a></li>
  </ul>
</nav>
</th:block>