一开始学习Thymeleaf的时候是不知道有th:block这个标签的,这是因为在使用Thymeleaf的过程中遇到了各种各样的需求才导致有这样的一种需要,那就是多种同级容器标签动态重复迭代的需求,在不使用th:block这个标签的情况只能从后台拼接字符串输出到前端显示,这样就导致了后端代码的臃肿,看起来很不优雅,后来在互联网上查找了很久才发现有th:block这个标签才完美解决了这种情况。
th:block的作用
它是Thymeleaf提供的唯一的一个Thymeleaf块级元素,其特殊性在于Thymeleaf模板引擎在处理< th:block >的时候会删掉它本身,标签本身不显示,而保留其内容
th:block的用法和使用场景
1、多种同级容器标签动态重复迭代
span和div两个块重复迭代
<th:block th:each="user : ${users}">
<span class="timeline-label">
<span class="label btn btn-primary">2021年8月</span>
</span>
<div class="timeline-item">
<div class="timeline-point timeline-point-success">
<i class="bi bi-record-circle"></i>
<div class="timeline-event">
<div class="timeline-body">
<ul class="list-group mb-2 list-style-reset">
<li class="border-bottom mb-2">
<a href="info.html"><i class="bi bi-caret-right"></i> Spring Boot Web 开发注解篇</a>
<li class="border-bottom mb-2">
<a href="info.html"><i class="bi bi-caret-right"></i> Spring Boot 表单验证篇</a>
</th:block>
2、多种条件相同的模块控制的条件分支
添加和修改两个功能相同条件下显示
<th:block th:if='${flag==1}'>
<button>添加</button>
<button>修改</button>
</th:block>
<button>删除</button>
3、与原型注释块结合使用
<table>
<!--/*/ <th:block th:each="user : ${users}"> /*/-->
<td th:text="${user.login}">...</td>
<td th:text="${user.name}">...</td>
<td colspan="2" th:text="${user.address}">...</td>
<!--/*/ </th:block> /*/-->
</table>
此解决方案如何使模板成为有效的HTML(无需在 <table> 内添加隐藏的<div>),并且当在浏览器中作为原型静态打开时,仍可以正常使用!