2024.10月25日- SpringBoot整合Thymeleaf
SpringBoot整合Thymeleaf
第一步:引入起步依赖
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> <version>3.1.5</version> </dependency>
第二步:添加Thymeleaf配置项
然后在配置文件中配置thymeleaf的配置项
# application.properties spring.thymeleaf.cache=false spring.thymeleaf.mode=html spring.thymeleaf.prefix=classpath:/templates/ spring.thymeleaf.suffix=.html
或者
spring: thymeleaf: cache: false mode: HTML prefix: classpath:/templates/ suffix: .html
配置项以及其他配置项说明 #spring.thymeleaf.cache = true #启用模板缓存。 #spring.thymeleaf.check-template = true #在呈现模板之前检查模板是否存在。 #spring.thymeleaf.check-template-location = true #检查模板位置是否存在。 #spring.thymeleaf.content-type = text / html #Content-Type值。 #spring.thymeleaf.enabled = true #启用MVC Thymeleaf视图分辨率。 #spring.thymeleaf.encoding = UTF-8 #模板编码。 #spring.thymeleaf.excluded-view-names = #应该从解决方案中排除的视图名称的逗号分隔列表。 #spring.thymeleaf.mode = HTML5 #应用于模板的模板模式。另请参见StandardTemplateModeHandlers。 #spring.thymeleaf.prefix = classpath:/ templates / #在构建URL时预先查看名称的前缀。 #spring.thymeleaf.suffix = .html #构建URL时附加到查看名称的后缀。"前缀+模板名称+后缀"即可定位到具体的模板 #spring.thymeleaf.template-resolver-order = #链中模板解析器的顺序。 #spring.thymeleaf.view-names = #可以解析的视图名称的逗号分隔列表。/ templates / #在构建URL时先查看名称的前缀。 #spring.thymeleaf.suffix = .html #构建URL时附加到查看名称的后缀。 #spring.thymeleaf.template-resolver-order = #链中模板解析器的顺序。 #spring.thymeleaf.view-names = #可以解析的视图名称的逗号分隔列表。/ templates / #在构建URL时先查看名称的前缀。 #spring.thymeleaf.suffix = .html #构建URL时附加到查看名称的后缀。 #spring.thymeleaf.template-resolver-order = #链中模板解析器的顺序。 #spring.thymeleaf.view-names = #可以解析的视图名称的逗号分隔列表。
第三步:在html模版中声明名称空间,可避免编辑器出现 html 验证错误。
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title th:text="${title}">Thymeleaf语法练习</title> </head> <body> </body> </html>
之后,就可以使用Thymeleaf引擎的模版语法了。
Thymeleaf语法
-
表达式
-
表达式一览
表达式名字 | 语法 | 用途 |
变量取值 | ${...} | 获取请求域、session域、对象等值 |
选择变量 | *{...} | 获取上下文对象值 |
消息 | #{...} | 获取国际化等值 |
连接 | @{...} | 生成连接 |
片段表达式 | ~{...} | jsp:include作用,引入公共页面片段 |
行内写法:[[表达式]] 。在标签外使用表达式,需要这样写才会生效,否则就成了字符串。
字面量
文本值:'hsp edu','hello'
数字:10,7,36.8
布尔值:true,false
空值:nulI
变量:name,age,…变量名不能有空格
文本操作
字符串拼接:+
变量替换:| 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)
5.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
6.迭代
<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>
7.条件运算
<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、变量表达式中提供了很多的内置方法,该内置方法是用#开头,请不要与#{}消息表达式弄混。