# Springboot-thymeleaf
**Repository Path**: salute83/springboot-thymeleaf
## Basic Information
- **Project Name**: Springboot-thymeleaf
- **Description**: Springboot 整合 thymeleaf
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 1
- **Forks**: 0
- **Created**: 2022-08-23
- **Last Updated**: 2023-06-03
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
## 参考网站
1. [Springboot 整合 thymeleaf](https://www.cnblogs.com/rqb0/p/16038378.html#:~:text=SpringBoot%E6%A1%86%E6%9E%B6%E4%B8%AD%E6%8F%90%E4%BE%9B%E4%BA%86%E5%AF%B9Thymeleaf%E6%A8%A1%E6%9D%BF%E5%BC%95%E6%93%8E%E7%9A%84%E8%87%AA%E5%8A%A8%E5%8A%A0%E8%BD%BD%E9%85%8D%E7%BD%AE%EF%BC%8C%E5%9C%A8SpringBoot%E7%9A%84%E8%87%AA%E5%8A%A8%E9%85%8D%E7%BD%AE%E7%B1%BB%E5%8C%85%E4%B8%AD%EF%BC%8C%E6%9C%89%E4%B8%80%E4%B8%AA%20org.springframework.boot.autoconfigure.thymeleaf%20%E5%8C%85%EF%BC%8C%E5%AE%9A%E4%B9%89%E7%9A%84ThymeleafProperties%E7%B1%BB%E5%B0%B1%E6%98%AFthymeleaf%E7%9A%84%E8%87%AA%E5%8A%A8%E9%85%8D%E7%BD%AE%E7%B1%BB%EF%BC%8C%E5%85%B6%E4%B8%AD%E6%8C%87%E5%AE%9A%E4%BA%86thymeleaf%E6%A1%86%E6%9E%B6%E7%9A%84%E4%B8%80%E4%BA%9B%E9%BB%98%E8%AE%A4%E5%B1%9E%E6%80%A7%EF%BC%8C%E6%AF%94%E5%A6%82%E6%A8%A1%E6%9D%BF%E7%9A%84%E9%BB%98%E8%AE%A4%E8%B7%AF%E5%BE%84%E5%89%8D%E7%BC%80,classpath%3A%2Ftemplates%2F%20%EF%BC%8C%E4%BB%A5%E5%8F%8A%E6%A8%A1%E6%9D%BF%E6%96%87%E4%BB%B6%E6%A0%BC%E5%BC%8F%E5%90%8E%E7%BC%80.html%20%E3%80%82)
2. [SpringBoot系列(六)集成thymeleaf详解版](https://www.cnblogs.com/swzx-1213/p/12726432.html)
3. [springboot中Thymeleaf的使用](https://www.jianshu.com/p/3426794a17cb)
4. [Springboot 整合 thymeleaf](http://docs.tumo.tycoding.cn/#/docs/boot/spring-boot-thymeleaf)
## thymeleaf 是什么
Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎,它可以完全替代 JSP 。也就是说JSP中的特性在Thymeleaf几乎都有对应的支持。Thymeleaf支持HTML原型,通过Thymeleaf特殊的标签可以基本实现JSP中动态数据的展示效果。
## Springboot 整合 thymeleaf
## 创建项目
1. 创建 `Springboot - Maven` 项目
2. 项目名称为:`Springboot-thymeleaf`
## 目录结构
```text
├─main
│ ├─java
│ │ └─com
│ │ └─test
│ │ └─springboot
│ │ └─thymeleaf
│ │ ├─controller
│ │ └─pojo
│ └─resources
│ ├─static
│ └─templates
└─test
└─java
└─com
└─test
└─springboot
└─thymeleaf
```

Thymeleaf 支持渲染HTML,因此通常我们使用的页面模板也就是HTML,同时它需要遵循一定的规则:
1. 比如在spring boot项目中,通常我们将Thymeleaf渲染的页面放在`resources/templates`目录下,这样Thymeleaf会默认识别。
2. 若想要在HTML页面中使用Thymeleaf,需要修改 ``为``
3. 在spring boot项目中`resources/static`目录下的文件可通过浏览器直接访问,而`resources/templates`下的HTML不能通过浏览器直接访问,而需要Spring Mvc这样的框架映射到那个页面地址。
### 导入依赖
```xml
org.projectlombok
lombok
org.springframework.boot
spring-boot-starter-thymeleaf
org.springframework.boot
spring-boot-starter-web
```
### 修改配置文件
```properties
spring.thymeleaf.mode = LEGACYHTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
spring.thymeleaf.suffix=.html
#开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
```
其中`spring.thymeleaf.mode = LEGACYHTML5`配置thymeleaf的模式,不要使用`spring.thymeleaf.mode = HTML5`,因为严格遵循HTML5规范会对非严格的报错,例如``,``标签没有结束``就会报错。
### 创建路由控制类
> 在main/java目录下新建RouterController.java
```java
package com.test.springboot.thymeleaf.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class RouterController {
@GetMapping("/index")
public String index(){
return "index";
}
}
```
这个`return "index"`中`index`是`templates`根目录下的`index.html`,如果是`templates/common/main.html`页面,就应该`return "/common/main.html"`
### 创建模板文件
> 在`main/resources/templates`目录下新建`index.html`
```html
Title
Index
```
### 访问页面
执行`main/java/ThymeleafApplication.java`启动类,用浏览器访问`localhost:8080/index`

## thymeleaf 常用表达式
### 变量表达式
变量表达式级即OGNL表达式或Spring EL表达式(在Spring术语中也叫做model attributes),例如:
```html
${user.username}
```
**案例:**
1. 修改`RouterController.java`
```java
@Controller
public class RouterController {
@GetMapping("/index")
public String index(Model model) {
model.addAttribute("demo", "测试");
return "index";
}
}
```
2. 修改index.html
```java
Title
Index
`${...}`表达式:
```
### `*`号表达式
如果`model.addAttribute()`的是一个对象而不是字符串,就可以用`*`表达式分别获取`model`对象中的元素,如:
1. 创建实体类
```java
public class User implements Serializable {
private String username;
private String password;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
```
2. 修改RouterController.java
```java
@Controller
public class RouterController {
@GetMapping("/index")
public String index(Model model) {
model.addAttribute("demo", "测试");
User user = new User();
user.setUsername("tycoding");
user.setPassword("123");
model.addAttribute("user", user);
return "index";
}
}
```
3. 修改index.html
```html
`*{...}`表达式:
```
**注意:**
1. 使用`*{...}`表达式必须保证`*{}`在`th:object="${...}`标签的包裹下,且`*{...}`必须是`${...}`下的一个元素,否则报错。例如这样写是获取不到元素的:
```html
`*{...}`表达式:
错误实例:
```
2. 如果页面需要不在`th:object`包裹下获取对象中的元素,可以使用如下:
```java
```
### URL 表达式
例如:会自动引入`resources/statis/css/`下的`base.css`文件
```html
```
这和JSP页面中使用,是一个道理。
```java
```
### 表达式支持的语法
**字面(Literals)**
- 文本文字(Text literals): ‘one text’, ‘Another one!’,…
- 数字文本(Number literals): 0, 34, 3.0, 12.3,…
- 布尔文本(Boolean literals): true, false
- 空(Null literal): null
- 文字标记(Literal tokens): one, sometext, main,…
**文本操作(Text operations)**
- 字符串连接(String concatenation): +
- 文本替换(Literal substitutions): |The name is ${name}|
**算术运算(Arithmetic operations)**
- 二元运算符(Binary operators): +, -, *, /, %
- 减号(单目运算符)Minus sign (unary operator): -
**布尔操作(Boolean operations)**
- 二元运算符(Binary operators):and, or
- 布尔否定(一元运算符)Boolean negation (unary operator):!, not
**比较和等价(Comparisons and equality)**
- 比较(Comparators): >, <, >=, <= (gt, lt, ge, le)
- 等值运算符(Equality operators):==, != (eq, ne)
**条件运算符(Conditional operators)**
- If-then: (if) ? (then)
- If-then-else: (if) ? (then) : (else)
- Default: (value) ?: (defaultvalue)
所有这些特征可以被组合并嵌套:
```java
'User is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))
```
### 常用的th 标签
