Thymeleaf轮播，每页固定条数_thymeleaf一个页面有两个轮播图需要实例化几次-优快云博客

本文链接：https://blog.youkuaiyun.com/FCXAIQQ/article/details/109818134

本文介绍如何使用Thymeleaf实现轮播图功能，每页展示两条数据。通过计算页数并利用Thymeleaf的循环特性，确保轮播图能够正确显示推荐列表中的所有元素。

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

最近公司在用Thymeleaf做门户端，碰到点难题，记录下。
需求：Thymeleaf轮播，每页固定2条。页数后台计算，先看代码：
页面代码：

<div class="item active" th:each="i:${#numbers.sequence(0,recommendPagination)}"  th:class="${i eq 0 ? 'item active' : 'item'}">
     <div class="lxf-box-list">
          <div class="recommend-item" th:each="k:${#numbers.sequence(0,1)}"  th:if="${#lists.size(recommendList) gt k+(i*2)}">
	          <div class="info">
	             <p th:utext="${recommendList[k+(i*2)].getAuthor()}"> FCXIQAQ</p>
	          </div>
          </div>
     </div>
</div>

这是对应的部分Java后台代码：

//查询推荐列表
        List<FrontJournalArticleVO> recommendArticle = articleService.getRecommendArticle(id);
        model.addAttribute("recommendList", recommendArticle);
        int ceil = (int) Math.ceil(recommendArticle.size() / 2.0);
        if (ceil > 0){
            ceil = ceil - 1;
        }
        model.addAttribute("recommendPagination", ceil);

recommendPagination 是页数，因为每页两条，获取到数据集合后除以二，向上取整，Thymeleaf循环索引从0开始，所以，如果recommendPagination的值大于0的话，需要减去1,。比如，数据一共三条，两页，计算出来recommendPagination就应该是1（索引从0开始）。
th:each="i:${#numbers.sequence(0,recommendPagination)}"的意义就是循环几页，0到recommendPagination。recommendPagination是1，就是两页（0,1）。recommendPagination是2，就是三页（0，1，2）。i 就是循环的值。
th:each="k:${#numbers.sequence(0,1)}" 就是循环两条数据，k 为 0和1。循环三条就是（0,2），四条就是（0,3），以此类推。
th:if="${#lists.size(recommendList) gt k+(i*2)}" 是recommendList集合的元素个数，大于当前循环的元素量（k+(i*2)），判断为true时，进入循环。
以上可以达到轮播图效果，每页两条。