Thymeleaf介绍

翻译：百里香叶;一个现代服务器端 Java 模板引擎。

是什么：服务器渲染技术（jsp也是）。它通常和SpringBoot结合使用。

在线文档：https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html

---

基本介绍

Thymeleaf是什么?

1.Thymeleaf是一个跟Velocity、FreeMarker类似的模板引擎，可完全替代JSP

2.Thymeleaf,是一个java类库，他是一个xml/xhtml/html5的模板引擎，可以作为mvc的web应用的view层

• Thymeleaf的优点

1.实现JSTL、OGNL表达式效果，语法相似，java程序员上手快

2.Thymeleaf模版页面无需服务器渲染，也可以被浏览器运行，页面简洁。

3.SpringBoot支特FreeMarker、Thymeleaf、Velocity

Thymeleaf的缺点

1.Thymeleaf: Thymeleaf is a modern server-side Java template engine for both web and standalone environments

2.缺点：并不是一个高性能的引擎，适用于单体应用

3.说明：如果要做一个高并发的应用，选择前后端分离更好，但是作为SpringBoot推荐的模板引擎，老师还是要讲解Thymeleaf使用，在工作中遇到会使用

4.Vue+ElementPlus+Axios+SpringBoot前后端分离是主流方案。

机制说明

1. Thymeleaf是服务器渲染技术，页面数据是在服务端进行渲染的

2. 比如：manage.html中一段thymeleaf代码，是在用户请求该页面时，有thymeleaf模板引擎完成处理的（在服务端完成），并将结果页面返回。

3. 因此使用了Thymeleaf,并不是前后端分离（是服务器端渲染技术）。

---

Thymeleaf语法

• 表达式

1. 表达式一览

表达式名字	语法	用途
变量取值	${...}	获取请求域、session域、对象等值
选择变量	*{...}	获取上下文对象值
消息	#{...}	获取国际化等值
连接	@{...}	生成连接
片段表达式	~{...}	jsp:include作用，引入公共页面片段

行内写法：[[表达式]] 。在标签外使用表达式，需要这样写才会生效，否则就成了字符串。

2. 字面量

文本值：'hsp edu','hello'

数字：10,7,36.8

布尔值：true,false

空值：nulI

变量：name,age,…变量名不能有空格

3. 文本操作

字符串拼接：+

变量替换：| age=${age} |

• 运算符

1.数学运算

运算符：+，一，*，/，%

2.布尔运算

运算符：and,or

一元运算：！，not

3.比较运算

比较：>，<，>=，<=(gt,lt,ge,le)等式：==，l=(eq,ne)

4.条件运算

If-then:(if)?(then)

If-then-else:(if)?(then):(else)

Default:(value)?:(defaultvalue)

• th属性

html有的属性，Thymeleaf基本都有，而常用的属性大概有七八个。其中th属性执行的优先级从1~8,数字越低优先级越高

• th:text：设置当前元素的文本内容，相同功能的还有th:utext,两者的区别在于前者不会转义html标签，后者会。优先级不高：order=7

• th:value:设置当前元素的value值，类似修改指定属性的还有th:src,th:href。优先级不高：order=6

• th:each:遍历循环元素，和th:text或th:value一起使用。注意该属性修饰的标签位置，详细往后看。优先级很高：order=2

• th:if:条件判断，类似的还有th:unless,th:switch,th:case。优先级较高：order=3

• th:insert:代码块引入，类似的还有th:replace,th:include,三者的区别较大，若使用不恰当会破坏html结构，常用于公共代码块提取的场景。优先级最高：order=1

• th:fragment:定义代码块，方便被th:insert引用。优先级最低：order=8

• th:object:声明变量，一般和*{}一起配合使用，达到偷懒的效果。优先级一般：order=4

• th:attr:修改任意属性，实际开发中用的较少，因为有丰富的其他th属性帮忙，类似的还有th:attrappend,th:attrprepend。优先级一般：order=5

• 迭代

<tr th:each="prod:${prods}">
    <td th:text="${prod.name}">Onions</td>
    <td th:text="${prod.price}">2.41</td>
    <td th:text="${prod.inStock}?#{true}:#{false}">yes</td>
</tr>

• 条件运算

<a href="comments.html"
th:href="@{/product/comments(prodId=${prod.id})}>"
th:if="${not #lists.isEmpty(prod.comments)}">view</a>

<div th:switch="${user.role}">
    <p th:case="'admin'">User is an administrator</p>
    <p th:case="#{roles.manager}">User is a manager</p>
    <p th:case="*">User is some other thing</p>
</div>

• 使用Thymeleaf的th属性需要注意点

1、若要使用所hymeleaf语法，首先要声明名称空间：xmIns:th="http://www.thymeleaf.org"

2、设置文本内容th:text,设置input的值th:vaue,循环输出th:each,条件判断th:if,插入代码块

th:insert,定义代码块th:fragment,声明变量th:object

3、th:each的用法需要格外注意，打个比方：如果你要循环一个div中的p标签，则th:each属性必须放在p标签上。若你将th:each属性放在div上，则循环的是将整个div.

4、变量表达式中提供了很多的内置方法，该内置方法是用#开头，请不要与#{}消息表达式弄混。