引擎模板——Thymeleaf

最新推荐文章于 2024-06-03 09:41:48 发布

夏目不听话

最新推荐文章于 2024-06-03 09:41:48 发布

阅读量2.1k

点赞数 21

文章标签： java

本文链接：https://blog.csdn.net/weixin_55689501/article/details/136567812

版权

引擎模板——Thymeleaf

一、什么是Thymeleaf

Thymeleaf是适用于Web和独立环境的现代服务器端Java引擎模板

1、模板引擎介绍

模板引擎（这里特指用于Web开发的模板引擎）是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的html文档。从字面上理解模板引擎，最重要的就是模板二字，这个意思就是做好一个模板后套入对应位置的数据，最终以html的格式展示出来，这就是模板引擎的作用。
对于模板引擎的理解，可以这样形象的做一个类比：开会！ 相信你在上学初高中时候每次开会都要提前布置场地、拿小板凳、收拾场地。而你上了大学之后每次开会再也不去大操场了,每次开会都去学校的大会议室，桌子板凳音响主席台齐全，来个人即可，还可复用……。模板引擎的功能就类似我们的会议室开会一样开箱即用，将模板设计好之后直接填充数据即可而不需要重新设计整个页面。提高页面、代码的复用性。

不仅如此，在Java中模板引擎还有很多，模板引擎是动态网页发展进步的产物，在最初并且流传度最广的jsp它就是一个模板引擎。jsp是官方标准的模板，但是由于jsp的缺点比较多也挺严重的，所以很多人弃用jsp选用第三方的模板引擎，市面上开源的第三方的模板引擎也比较多，有Thymeleaf、FreeMaker、Velocity等模板引擎受众较广。

2、Thymeleaf介绍

Thymeleaf是众多模板引擎的一种，从官方的介绍来看，Thymeleaf的目标很明确：

Thymeleaf的主要目标是为开发工作流程带来优雅自然的模板-HTML可以在浏览器中正确显示，也可以作为静态原型工作，从而可以在开发团队中加强协作。
Thymeleaf拥有适用于Spring Framework的模块，与开发者喜欢的工具的大量集成以及插入开发者自己的功能的能力，对于现代HTML5 JVM Web开发而言，Thymeleaf是理想的选择——尽管它还有很多工作要做。

并且随着市场使用的验证Thymeleaf也达到的它的目标和大家对他的期望，在实际开发有着广泛的应用。Thymeleaf作为被Springboot官方推荐的模板引擎，一定有很多过人和不寻同之处：

动静分离： Thymeleaf选用html作为模板页，这是任何一款其他模板引擎做不到的！Thymeleaf使用html通过一些特定标签语法代表其含义，但并未破坏html结构，即使无网络、不通过后端渲染也能在浏览器成功打开，大大方便界面的测试和修改。
开箱即用： Thymeleaf提供标准和Spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果，避免每天套模板、改JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
Springboot官方大力推荐和支持，Springboot官方做了很多默认配置，开发者只需编写对应html即可，大大减轻了上手难度和配置复杂度。

此外，Thymeleaf在曾经还有一次大的版本升级，从Thymeleaf2.0—>Thymeleaf3.0。在Thymeleaf2.0时代，Thymeleaf基于xml实现，虽然它带来了许多出色强大的功能，但有时会降低性能效率，那个时候Thymeleaf的性能真的太差而被很多人所吐槽带来了很不好的印象。

但是Thymeleaf3.0对比Thymeleaf2.0有着翻天覆地的变化，几乎是全部重写了整个Thymeleaf引擎，在性能、效率上相比Thymeleaf2有了很大改善，能够满足更多项目的需求，且Thymeleaf3.0不再基于xml所以在html环境下有着更宽松的编程环境。

二、Thymeleaf语法详解

1、配置

虽然Springboot官方对Thymeleaf做了很多默认配置，但引入Thymeleaf的jar包依赖后很可能需要根据开发者特定需求进行更细化的配置，例如页面缓存、字体格式设置等等。

Springboot官方提供的配置内容有以下：

# 是否启用模板缓存，默认为true。启用后，模板在第一次编译后会被缓存，提高渲染效率。
spring.thymeleaf.cache=true 

# 在渲染模板之前是否检查模板是否存在，默认为false。
spring.thymeleaf.check-template=true 

# 是否检查模板位置是否存在，默认为true。
spring.thymeleaf.check-template-location=true 

# 是否启用Thymeleaf视图解析，适用于Web框架，默认为true。
spring.thymeleaf.enabled=true 

# 是否在SpringEL表达式中启用SpringEL编译器，默认为false。启用后可以提高表达式的执行效率。
spring.thymeleaf.enable-spring-el-compiler=false 

# 模板文件的编码方式，默认为"UTF-8"。
spring.thymeleaf.encoding=UTF-8 

# 逗号分隔的视图名称列表（允许使用模式），这些视图将被排除在解析之外。
spring.thymeleaf.excluded-view-names= 

# 应用于模板的模板模式，默认为"HTML"。也可以参考Thymeleaf的TemplateMode枚举了解其他模式。
spring.thymeleaf.mode=HTML 

# 构建URL时，视图名称前缀，默认为"classpath:/templates/"。
spring.thymeleaf.prefix=classpath:/templates/ 

# 当设置了最大块大小时，只有这些视图名称（允许使用模式）会以CHUNKED模式执行。
spring.thymeleaf.reactive.chunked-mode-view-names= 

# 即使设置了最大块大小，这些视图名称（允许使用模式）也会以FULL模式执行。
spring.thymeleaf.reactive.full-mode-view-names= 

# 用于写入响应的数据缓冲区的最大大小，以字节为单位，默认为0。
spring.thymeleaf.reactive.max-chunk-size=0 

# 视图技术支持的媒体类型。
spring.thymeleaf.reactive.media-types= 

# 写入HTTP响应的Content-Type值，默认为"text/html"。
spring.thymeleaf.servlet.content-type=text/html 

# 构建URL时，视图名称的后缀，默认为".html"。
spring.thymeleaf.suffix=.html 

# 模板解析器在链中的顺序。
spring.thymeleaf.template-resolver-order= 

# 逗号分隔的视图名称列表（允许使用模式），这些视图可以被解析。
spring.thymeleaf.view-names=

**注意：**上面的配置有些我们可能不常使用，因为Springboot官方做了默认配置大部分能够满足我们的使用需求，但如果项目有特殊需求也需要妥善使用这些配置。

比如spring.thymeleaf.cache=false是否允许页面缓存的配置，我们在开发时候要确保页面是最新的所以需要禁用缓存；而在上线运营时可能页面不常改动为了减少服务端压力以及提升客户端响应速度会允许页面缓存的使用。

再比如在开发虽然我们大部分使用UTF-8多一些，我们可以使用spring.thymeleaf.encoding=UTF-8来确定页面的编码，但如果你的项目是GBK编码就需要将它改成GBK。

另外Springboot默认模板引擎文件是放在templates目录下：spring.thymeleaf.prefix=classpath:/templates/,如果你有需求将模板引擎也可修改配置，将templates改为自己需要的目录。同理其他的配置如果需要自定义化也可参照上面配置进行修改。

2、常用标签

Thymeleaf通过特殊的标签来寻找属于Thymeleaf的部分，并渲染该部分内容，Thymeleaf标签有很多很多，功能也很丰富，这里列举一些比较常用的标签如下：

标签	作用	示例
th:id	替换id	`<input th:id="${user.id}"/>`
th:text	文本替换	`<p text:="${user.name}">bigsai</p>`
th:utext	支持html的文本替换	`<p utext:="${htmlcontent}">content</p>`
th:object	替换对象	`<div th:object="${user}"></div>`
th:value	替换值	`<input th:value="${user.name}" >`
th:each	迭代	`<tr th:each="student:${user}" >`
th:href	替换超链接	`<a th:href="@{index.html}">超链接</a>`
th:src	替换资源	`<script type="text/javascript" th:src="@{index.js}"></script>`

3、链接表达式: @{…}

Thymeleaf是一个基于html的模板引擎，我们还是需要加入特定标签来声明和使用Thymeleaf的语法。我们需要在Thymeleaf的头部加Thymeleaf标识：

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

Thymeleaf 中，如果想引入链接比如link，href，src，要使用@{资源地址}引入资源。资源地址可以是static目录下的静态资源，也可以是互联网中的绝对资源。

引入css

 <link rel="stylesheet" th:href="@{index.css}">

引入JavaScript：

 <script type="text/javascript" th:src="@{index.js}"></script>

超链接：

<a th:href="@{index.html}">超链接</a>

启动程序访问页面，页面的内容就自动修改成标准html语法格式的内容：

在这里插入图片描述

4、变量表达式: ${…}

Thymeleaf中可以通过${…}进行取值，这点和ONGL表达式语法一致。
例如创建一个User对象，在Model中添一些数据：

在这里插入图片描述

取普通字符串：
如果在controller中的Model直接存储某字符串，我们可以直接${对象名}进行取值。完整代码如下：

在这里插入图片描述

运行结果为：
在这里插入图片描述

取JavaBean对象:
取JavaBean对象也很容易，因为JavaBean自身有一些其他属性，所以咱们就可以使用${对象名.对象属性}或者${对象名['对象属性']}来取值，这和JavaScript语法很相似！除此之外，如果该JavaBean如果写了get方法，咱们也可以通过get方法取值例如${对象.get方法名}。完整代码如下：

在这里插入图片描述

运行结果为：

在这里插入图片描述

取List集合(each):
因为List集合是个有序列表，里面内容可能不止一个，需要遍历List对其中对象取值，而遍历需要用到标签：th:each,具体使用为 <tr th:each="item:${userList}">,其中item就相当于遍历每一次的对象名，在下面的作用域可以直接使用，而userList就是你在Model中储存的List的名称。完整代码如下：

在这里插入图片描述

运行结果为：

在这里插入图片描述

直接取Map:
很多时候不存JavaBean而是将一些值放入Map中，再将Map存在Model中，就需要对Map取值，Map可以使用${Map名['key']}来进行取值，也可以通过${Map名.key}取值，还可以用${map.get('key')}(java语法)来取值，完整代码如下：

在这里插入图片描述

运行结果为：

在这里插入图片描述

遍历Map：
如果想遍历Map获取它的key和value，就要使用和List相似的遍历方法，使用th:each="item:${Map名}"进行遍历，在下面只需使用item.key和item.value即可获得值。完整代码如下：

在这里插入图片描述

运行结果为：

在这里插入图片描述

5、选择变量表达式: *{…}

变量表达式不仅可以写成${…}，还可以写成*{…}。

但是，有一个重要的区别：星号语法对选定对象而不是整个上下文评估表达式。也就是说，只要没有选定的对象，美元(${…})和星号(*{...})的语法就完全一样。

什么是选定对象？使用th:object属性的表达式的结果。就可以选定对象，具体实例如下：

在这里插入图片描述

当然*{…}也可和${…}混用。上面的代码如果不使用选定对象，完全等价于：

在这里插入图片描述

运行结果为：

在这里插入图片描述

6、消息表达: #{…}

文本外部化是从模板文件中提取模板代码的片段，以便可以将它们保存在单独的文件(通常是.properties文件)中,文本的外部化片段通常称为“消息”。简单来说#{…}语法就是用来读取配置文件中数据的。在Thymeleaf可以使用#{...}语法获取消息，具体实例代码如下：
分别在templates目录下建立home.properties和application.properties中加入内容：
在这里插入图片描述