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、变量表达式中提供了很多的内置方法，该内置方法是用#开头，请不要与#{}消息表达式弄混。