thymeleaf学习笔记

2024-02-22 09:25:10

介绍

官方网址：https://www.thymeleaf.org/

官方文档地址：https://www.thymeleaf.org/doc/tutorials/3.0/thymeleafspring.pdf

thymeleaf是Spring推荐使用的模板引擎

导入依赖

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

默认格式与前后缀

我们通过查看spring boot的自动配置文档可知，使用thymeleaf的时候，对页面进行解析会自动拼接前后缀，默认支持html页面类型。

例如，我们return一个hello.html页面回来，只需要return “hello”，会自动拼接前后缀，即classpath:/templates/+hello+.html

@ConfigurationProperties(prefix = "spring.thymeleaf")
public class ThymeleafProperties {

	private static final Charset DEFAULT_ENCODING = Charset.forName("UTF-8");  //默认编码类型

	private static final MimeType DEFAULT_CONTENT_TYPE = MimeType.valueOf("text/html");

	public static final String DEFAULT_PREFIX = "classpath:/templates/";  //前缀

	public static final String DEFAULT_SUFFIX = ".html";  //后缀

导入名称空间

我们在编写html文件的时候，需要使用thymeleaf的语法才能取到对应的值，我们需要导入名称空间，否则没有语法提示

<!DOCTYPE html>
<!--导入名称空间-->
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>hello</h1>

</body>
</html>

初窥thymeleaf

java文件

//@RestController
@Controller
@RequestMapping("/seller/order")
public class SellOrderController {
    @Autowired
    private OrderServiceImpl orderService;

    @GetMapping("/list")
    public ModelAndView list(Map<String,Object> map) {  //map默认会放在请求域中
        map.put("hello","我爱你");
        return "order/list";
    }
}

html

<!DOCTYPE html>
<!--导入名称空间-->
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <h1>hello</h1>
    <!--取出hello-->
    <div th:text="${hello}">这里是默认值哦</div>

</body>
</html>

我们通过设置th:text="${hello}"就可以将默认值进行修改

th：语法规则

上面我们介绍了使用th替换默认值，我们写的是text，也就是块块里面的东西，其实所有原生属性都可以替换，例如id、class等等，都可以先写一个默认值，再使用th来改变。

在官方文档，列举了哪些属性先解析，哪些属性后解析

标准表达式语法

简单的表达式：
- 获取变量表达式： ${…}
- 选择变量表达式： *{…}
 - 与** ∗ ∗ 类似，配合 t h : o b j e c t = " {}**类似，配合th:object=" ∗∗类似，配合th:object="{session.user}"，可以使用*替代上面的元素
 - ```
 <div th:object="${session.user}">
 Name: Sebastian.
 Surname: Pepper.
 Nationality: Saturn.
 </div>
```
- 消息表达式： #{…}
- 链接URL表达式： @{…}
 - ```
 @{/order/process(execId=${execId},execType='FAST')}
```
- 片段表达式： ~{…}
字面
- 文本文字： ‘one text’ ， ‘Another one!’ ，…
- 号码文字： 0 ， 34 ， 3.0 ， 12.3 ，…
- 布尔文字： true ， false
- null文本： null
- 文字标记： one ， sometext ， main ，…
文本操作：
- 字符串连接： +
- 文字替换： |The name is ${name}|
算术运算：
- 二元运算符： + ， - ， ***** ， / ， %
- 减号（一元运算符）： -
布尔操作：
- 二元运算符： and ， or
- 布尔否定（一元运算符）： ! ， not
比较和平等：
- 比较： > ， < ， >= ， <= （ gt ， lt ， ge ， le ）
 - 大于号、小于号在html里是特殊字符，我们可以使用括号内的东西替代
- 平等运营商： == ， != （ eq ， ne ）
有条件的经营者：
- 如果 - 则： (if) ? (then)
- 如果 - 则 - 否则： (if) ? (then) : (else)
  - 三元运算符
- 默认： (value) ?: (defaultvalue)
特殊记号：
- 无操作： _

所有这些特征可以被组合并嵌套：

'User is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))

码农公寓

介绍