Thymeleaf常用属性

1,131 阅读2分钟

「这是我参与11月更文挑战的第3天,活动详情查看:2021最后一次更文挑战」。

1、 th:each 对象遍历

常用标签,类似于JSTL中的c:forEach,该属性循环遍历集合数组Map,下面以一个list集合来介绍th:each属性标签

 <tr th:each="u:${list}">  //${list}是后台传过来的key , u是${list}定义遍历名称。
        <td th:text="${uStat.count}">ID</td>  //uStat是循环体的信息。
        <td th:text="${u.name}">姓名</td>     //对象的属性信息
        <td th:text="${u.age}">年龄</td>      //对象的属性信息
        <td th:text="${u.sex}">性别</td>      //对象的属性信息
        <td>操作</td>
    </tr>

补充:

  1. th:each="u:${list} 标签使用,循环体的信息获取默认是名称+stat,同时也可以自定义名称,中间以,号分隔。

 例如: th:each="u,i:${list}"

  1. 循环体可以获取信息有:  index 当前迭代对象的index(0)开始

 size ---迭代对象大小

 count ---(从1开始),常用于显示列表,从1开始排序

 current ---(当前迭代变量)

 even/odd ---布尔值(是否是偶数/奇数  0开始)

 first ---布尔值 是否是第一个

 last ---布尔值 是否是最后一个

以上循环体信息均可以通过th:each标签

2、 th:if

判断条件

<td>
    <span th:if="${u.sex==1}"></span>
    <span th:if="${u.sex==0}"></span>

</td>

3、 th:switch 和 th:case

th:switch ---多路选择,配合th:case 使用

th:case ---th:switch的一个分支

如下示例,实现对状态码进行选择,th:case="*"的意思与other的意思相近。

 <h1>switch示例</h1>
    <div th:switch="${status}">
        <span th:case="1">有效</span>
        <span th:case="2">无效</span>
        <span th:case="3">黑名单</span>
        <span th:case="*">其他</span>
    </div>

4、 th:src

th:src标签,用于外部资源引入, 比如<script>标签的 src 属性, <img>标签的 src 属性,常与@{}表达式结合使用。

图片:
<img src="/images/1.jpg" th:src="@{/images/1.jpg}" />
外部JS文件:
<script type="text/javascript" src="js/jquery.min.js" th:src="@{/js/page.js}"></script>

<script src>属性和<img src>属性常与@{}组合使用 常用于动态资源数据获取(绝对路径)

5、th:id/name/value

为属性赋值,替换 html 标签中的 id,name,value 属性

<input type="text" th:text="${msg}"/>
<input type="text" th:text="${msg}" th:value="${msg}"/>

6、th:attr

设置标签属性,该属性也是用于给 HTML 中某元素的某属性赋值,优点是可以给 html 中没有定义的属性动态的赋值。多个属性可以用逗号分隔

可以通过该属性为某个name赋动态名称

//给 value和src赋值
<input type="text"  th:attr="value=${msg},src=@{/image/aa.jpg}" />
//给 name和src赋值
<input type="text"  th:attr="name=${msg},src=@{/image/aa.jpg}" />

7、th:insert 和 th:replace的区别

th:insert和th:replace都可以引入片段,用的方式是一样的,两者的区别在于:

th:insert: 保留引入时使用的标签

th:replace:不保留引入时使用的标签, 将声明片段直接覆盖当前引用标签

8、 th:inline

(1)内敛文本(th:inline=”text”) 内敛文本表达式不依赖于 html 标签,直接使用内敛表达式[[表达式]]即可获取动态数据(相当于是加了两个方括号的EL表达式了), 但必须要求在父级标签上加 th:inline = “text”属性 。 注意:一般我们将内联文本放到标签中

(2)内敛脚本(th:inline=”javascript”)

th:inline="javascript"用于 js 代码中获取后台的动态数据

9、优先级顺序

因为Thymeleaf标签有非常多,这里只列出最常用的几个;由于一个标签内可以包含多个th:x属性,其生效的优先级顺序为: include,each,if/unless/switch/case,with,attr/attrprepend/attrappend,value/href,src ,etc,text/utext,fragment,remove。