2020-07-14 16:08 已编辑 Java

关注

thymeleaf

thymeleaf

thymeleaf 跟 JSP 一样，就是运行之后，就得到纯 HTML了。区别在与，不运行之前， thymeleaf 也是纯 html ...
所以 thymeleaf 不需要服务端的支持，就能够被以 html 的方式打开，这样就方便前端人员独立设计与调试
pom.xml

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>    
        </dependency>

application.properties

spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
#缓存设置为false, 这样修改之后马上生效，便于调试
spring.thymeleaf.cache=false
spring.thymeleaf.servlet.content-type=text/html
#上下文
server.servlet.context-path=/thymeleaf

在 resources 下新建目录 templates, 然后新建文件 hello.html
声明当前文件是 thymeleaf, 里面可以用th开头的属性

<html xmlns:th="http://www.thymeleaf.org">

把 name 的值显示：用th:text中的值替代

<p th:text="${name}" >name</p>

字符串拼写

<p th:text="'Hello！ ' + ${name} + '!'" >hello world</p>
<p th:text="|Hello！ ${name}!|" >hello world</p>

css\js注入，其中href、src是以当前html文件为准，th:href/th:src以webapp为准

<link rel="stylesheet" type="text/css" media="all" href="../../webapp/static/css/style.css" th:href="@{/static/css/style.css}"/>
<script type="text/javascript" src="../../webapp/static/js/thymeleaf.js" th:src="@{/static/js/thymeleaf.js}"></script>

显示转义和非转义的 html 文本

<p th:text="${htmlContent}" ></p>未转义的html语句
<p th:utext="${htmlContent}" ></p>转义的html语句

显示对象以及对象属性

    <p th:text="${currentProduct}" ></p>显示对象的toString方法，默认是“类名+哈希编码”
    <p th:text="${currentProduct.name}" ></p>默认显示调用对象的getName方法
    <p th:text="${currentProduct.getName()}" ></p>显示调用对象的getName方法

*{}方式显示属性

<div class="showing" th:object="${currentProduct}">
    <p th:text="*{name}" ></p>
</div>

算数运算

    <p th:text="${currentProduct.price+999}" ></p>

加入其他页面
其他页面：

<footer th:fragment="footer1"> 
   <p >All Rights Reserved</p>
</footer>
<footer th:fragment="footer2(start,now)"> 
   <p th:text="|${start} - ${now} All Rights Reserved|"></p>
</footer>

加入：
th:insert ：保留自己的主标签，保留th:fragment的主标签。
th:replace ：不要自己的主标签，保留th:fragment的主标签。

<div th:replace="include::footer1" ></div>
<div th:replace="include::footer2(2015,2018)" ></div>

条件判断

boolean 类型并且值是 true, 返回 true
数值类型并且值不是 0, 返回 true
字符类型(Char)并且值不是 0, 返回 true
String 类型并且值不是 "false", "off", "no", 返回 true
不是 boolean, 数值, 字符, String 的其他类型, 返回 true
值是 null, 返回 false

true显示

<p th:if="${testBoolean}" ></p>

true不显示

<p th:if="${not testBoolean}" ></p>

true不显示

<p th:unless="${testBoolean}" ></p>

三元表达式

<p th:text="${testBoolean}?'显示本句话':''" ></p>

遍历

<tr th:each="p: ${ps}">
   <td th:text="${p.id}"></td>
   <td th:text="${p.name}"></td>
   <td th:text="${p.price}"></td>
</tr>

带状态的遍历

status里还包含了如下信息：
index 属性, 0 开始的索引值
count 属性, 1 开始的索引值
size 属性, 集合内元素的总量
current 属性, 当前的迭代对象
even/odd 属性, boolean 类型的, 用来判断是否是偶数个还是奇数个
first 属性, boolean 类型, 是否是第一个
last 属性, boolean 类型, 是否是最后一个

<tr th:each="p,status: ${ps}" th:class="${status.even}?'even':'odd'">
                <td  th:text="${status.index}"></td>
                <td th:text="${p.id}"></td>
                <td th:text="${p.name}"></td>
                <td th:text="${p.price}"></td>
</tr>

内置工具

日期格式转换 #dates.format
直接输出日期
Tue Jun 05 10:39:41 CST 2019

 <p th:text="${now}"></p>

默认格式化
2019年6月5日上午10时29分41秒

 <p th:text="${#dates.format(now)}"></p>

自定义格式化
2019-06-05 10:29:41

 <p th:text="${#dates.format(now,'yyyy-MM-dd HH:mm:ss')}"></p>

其他内置工具
Execution Info

 获取页面模板的处理信息

Messages

 在变量表达式中获取外部消息的方法，与使用＃{...}语法获取的方法相同

URIs/URLs

 转义部分URL / URI的方法

Conversions

 用于执行已配置的转换服务的方法

Dates

 时间操作和时间格式化等

Calendars

 用于更复杂时间的格式化

Numbers

 格式化数字对象的方法

Strings

 字符串工具类

Objects

 一般对象类，通常用来判断非空

Booleans

 常用的布尔方法

Arrays

 数组工具类

Lists

 List 工具类

Sets

 Set 工具类

Maps

 常用Map方法

Aggregates

 在数组或集合上创建聚合的方法

IDs

 处理可能重复的id属性的方法

CRUD

<tr th:each="c:${page.list}">
            <td th:text="${c.id}"></td>
            <td th:text="${c.name}"></td>
            <td><a th:href="@{/editCategory(id=${c.id})}">编辑</a></td>
            <td><a th:href="@{/deleteCategory(id=${c.id})}">删除</a></td>
</tr>