Thymeleaf

最新推荐文章于 2023-03-11 13:52:17 发布

初夏那片海

最新推荐文章于 2023-03-11 13:52:17 发布

阅读量436

点赞数 1

本文链接：https://blog.csdn.net/qq_42265394/article/details/114000218

版权

Thymeleaf模板引擎

Thymeleaf 应该是目前最受欢迎的模板引擎技术了，Spring Boot 官方也推荐 Java web 开发中使用该技术来替代 JSP 技术，主要由于其“原型即页面”的理念与 Spring Boot 倡导的快速开发非常契合，同时 Thymeleaf 模板引擎技术也确实拥有其他技术所不具备的优点。

Thymeleaf 3

Thymeleaf 于 2016 年 5 月 8 日正式发布了 thymeleaf-3.0.0.RELEASE 版本，目前的大部分项目开发过程中也是使用 Thymeleaf 3.0 及以上版本，因此在这里简单的介绍一下 Thymeleaf 3 的特性。

完整的 HTML5 标记支持，全新的解析器
自带多种模板模式，也可扩展支持其他模板格式。
在 web 和非 web 环境（离线）下都可以正常工作
对 Spring web 开发的支持非常完善
独立于 Servlet API

Thymeleaf快速上手

新建一个项目

导入thymeleaf依赖

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

导入约束

在 resources/templates 目录新建模板文件 thymeleaf.html ，Thymeleaf 模板引擎的默认后缀名即为 html，新增文件后，首先在模板文件的标签中导入 Thymeleaf 的名称空间
导入该名称空间主要是为了 Thymeleaf 的语法提示和 Thymeleaf 标签的使用

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

新建一个Controller

后端通过Model对象存数据

@Controller
public class ThymeleafController {

    @RequestMapping("/tc")
    public String tc(Model model){
        model.addAttribute("msg","Hello Thymeleaf");
        return "thymeleaf";
    }
}

thymeleaf.html

前端通过thymeleaf语法取出数据
直接打开该页面显示内容是：默认
启动项目，通过请求访问内容是：Hello Thymeleaf

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<!--取出后端存的数据-->
<div>
    <h2 th:text="${msg}">默认</h2>
</div>

</body>
</html>

Thymeleaf属性

th:text 对应的是 HTML5 中的 text 属性，除 th:text 属性外，Thymeleaf 也提供了其他的标签属性来替换 HTML5 原生属性的值，属性节选如下：

th:background 对应 HTML5 中的背景属性
th:class 对应 HTML5 中的 class 属性
th:href 对应 HTML5 中的链接地址属性
th:id 和 th:name 分别对应 HTML5 中的 id 和 name 属性…
th:block 比较特殊，它是 Thymeleaf 提供的唯一的一个 Thymeleaf 块级元素，其特殊性在于 Thymeleaf 模板引擎在处理th:block的时候会删掉它本身，而保留其内容。

可以使用ModelMap存放多个数据

Thymeleaf 语法规则

表达式语法

变量表达式： ${…}
选择变量表达式： *{…}
信息表达式： #{…}
链接 URL 表达式： @{…}
分段表达式： ~{…}

字面量

字符串： ‘one text’, ‘Another one!’ …
数字： 0, 34, 3.0, 12.3 …
布尔值： true, false
Null 值： null
字面量标记：one, sometext, main …

文本运算

字符串拼接： +
字面量置换: |The name is ${name}|

算术运算

二元运算符： +, -, *, /, %
负号（一元运算符）： (unary operator): -

布尔运算

二元运算符： and, or
布尔非（一元运算符）： !, not

比较运算

比较： >, <, >=, <= (gt, lt, ge, le)
相等运算符： ==, != (eq, ne)
比较运算符也可以使用转义字符，比如大于号，可以使用 Thymeleaf 语法 gt 也可以使用转义字符>

条件运算符

If-then: (if) ? (then)
If-then-else: (if) ? (then) : (else)
Default: (value) ?: (defaultvalue)

特殊语法

无操作： _

Thymeleaf 模板引擎使用注意事项

必须引入名称空间

即使不引入以上名称空间，静态资源访问以及模板动态访问都不会报错，因此有些开发者可能会忽略这个事情。但是建议在开发过程中最好引入该名称空间，因为引入之后会有 Thymeleaf 代码的语法提示，能够提升开发效率，也减少人为造成的低级错误。

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

禁入模板引擎

Thymeleaf 的默认缓存设置是通过配置文件的 spring.thymeleaf.cache 配置属性决定的，通过如上 Thymeleaf 模板的配置属性类 ThymeleafProperties 可以发现该属性默认为 true，因此 Thymeleaf 默认是使用模板缓存的，该设置有助于改善应用程序的性能，因为模板只需编译一次即可，但是在开发过程中不能实时看到页面变更的效果，除非重启应用程序，因此建议将该属性设置为 false，在配置文件中修改如下：

spring.thymeleaf.cache=false

IDEA 中通过 Thymeleaf 语法读取变量时爆红问题

如下图所示，在刚开始使用 Thymeleaf 开发时可能会碰到这种问题，在模板文件中通过 Thymeleaf 语法读取变量时，该变量名称下会出现红色波浪线，也就是错误的标志。

在这里插入图片描述

只是由于 IDEA 中默认开启了表达式参数验证，即使在后端的 model 数据中添加了该变量，但是对于前端文件是无法感知的，因此会报这个错误，可以在 IDEA 中默认将验证关闭或者将提示级别修改掉也可以。

初夏那片海

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
Thymeleaf

Thymeleaf模板引擎Thymeleaf 应该是目前最受欢迎的模板引擎技术了，Spring Boot 官方也推荐 Java web 开发中使用该技术来替代 JSP 技术，主要由于其“原型即页面”的理念与 Spring Boot 倡导的快速开发非常契合，同时 Thymeleaf 模板引擎技术也确实拥有其他技术所不具备的优点。Thymeleaf 3Thymeleaf 于 2016 年 5 月 8 日正式发布了 thymeleaf-3.0.0.RELEASE 版本，目前的大部分项目开发过程中也是使用 T
复制链接

扫一扫