Thymeleaf基础教程

系列文章目录

`

---

---

一、Thymeleaf 语法规则

thymeleaf依赖导入：

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

html 标签中声明名称空间：

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

Thymeleaf 作为一种模板引擎，它拥有自己的语法规则。Thymeleaf 语法分为以下 2 类：

二、Thymeleaf 语法分为以下 2 类

标准表达式语法

th 属性

2.1 基础语法

2.1.1 变量表达式 ${}

使用方法：直接使用 th:xx = “${}” 获取对象属性：前端获取后端的数据

<form id="userForm">
    <input id="id" name="id" th:value="${user.id}"/>
    <input id="username" name="username" th:value="${user.username}"/>
    <input id="password" name="password" th:value="${user.password}"/>
</form>

<div th:text="hello"></div>

<div th:text="${user.username}"></div>

2.1.2 选择变量表达式 *{}

使用方法：首先通过th:object 获取对象，然后使用th:xx = "*{}"获取对象属性。
这种简写风格极为清爽，推荐大家在实际项目中使用：

<form id="userForm" th:object="${user}">
    <input id="id" name="id" th:value="*{id}"/>
    <input id="username" name="username" th:value="*{username}"/>
    <input id="password" name="password" th:value="*{password}"/>
</form>

2.1.3 链接表达式 @{}

使用方法：通过链接表达式@{}直接拿到应用路径，然后拼接静态资源路径:

<script th:src="@{jquery/jquery-1.10.2.min.js}"></script>
<link th:href="@{bootstrap/css/bootstrap.css}" rel="stylesheet" type="text/css">

2.1.4 消息表达式

即通常的国际化属性：#{msg} 用于获取国际化语言翻译值

<title th:text="#{user.title}"></title>

三、常用的 th 标签

常用标签有很多，部分举例。

四、迭代循环

想要遍历List集合很简单，配合th:each 即可快速完成迭代。例如遍历用户列表：

th:each="user:${users}">
       id："id" name="id" th:value="${user.id}"/> 

       姓名："username" name="username" th:value="${user.username}"/>