SpringBoot整合Thymeleaf

原创于 2023-06-12 11:32:58 发布 · 248 阅读

CC 4.0 BY-SA版权

文章标签：

本文介绍了Thymeleaf的基本知识点，包括变量输出、字符串相关操作如isEmpty、contains等，以及时间类型的处理。同时，展示了在SpringBoot项目中如何整合Thymeleaf，创建Controller和视图模板，并通过Model进行数据传递。此外，还讲解了th:if和th:switch条件判断在模板中的使用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、 Thymeleaf知识点汇总

1. 变量输出

th:text（在页面中输出值）

th:value（将值放到inputvalue属性中）

2. Thymeleaf内置对象

字符串相关操作：

 <!--调用了thymeleaf的内置对象，调用内置对象要用#-->
    <span th:text="${#strings.isEmpty(msg)}"></span>
    <hr>
    <!--判断字符串是否包含指定的数据-->
    <span th:text="${#strings.contains(msg,'9')}"></span>
    <span th:text="${#strings.contains(msg,'t')}"></span>
    <hr>
    <!--判断字符串以XXX开始-->
    <span th:text="${#strings.startsWith(msg,'a')}"></span>
    <span th:text="${#strings.startsWith(msg,'t')}"></span>
    <hr>
    <!--判断字符串以XXX结束-->
    <span th:text="${#strings.endsWith(msg,'a')}"></span>
    <span th:text="${#strings.endsWith(msg,'数据')}"></span>
    <hr>
    <!--字符串长度-->
    <span th:text="${#strings.length(msg)}"></span>
    <hr>
    <!--某字符在字符串中出现的位置-->
    <span th:text="${#strings.indexOf(msg,'y')}"></span>
    <hr>
    <!--截取字符串-->
    <span th:text="${#strings.substring(msg,1,3)}"></span>
    <hr>
    <span th:text="${#strings.substring(msg,5)}"></span>
    <hr>
    <!--大小写转换-->
    <span th:text="${#strings.toUpperCase(msg)}"></span>
    <hr>
    <span th:text="${#strings.toLowerCase(msg)}"></span>
    <hr>

时间类型的处理：

  <!--接收时间类型-->
    <span th:text="${#dates.format(key)}"></span>
    <hr>
  <!--设置固定格式-->   
    <span th:text="${#dates.format(key,'yyy/MM/dd')}"></span>
    <hr>
  <!--获取年-->       
    <span th:text="${#dates.year(key)}"></span>
    <hr>
  <!--获取月-->
    <span th:text="${#dates.month(key)}"></span>
    <hr>
  <!--获取日-->
    <span th:text="${#dates.day(key)}"></span>

3. 判断

th:if 条件判断，代码示例：

    <span th:if="${sex} == '男'">
        性别：男
    </span>

    <span th:if="${sex} == '女'">
        性别：女
    </span>

th:switch判断，代码示例：

    <div th:switch="${id}">
        <span th:case="1">ID为1</span>
        <span th:case="2">ID为2</span>
        <span th:case="3">ID为3</span>
    </div>

二、整合步骤

1. 创建springboot项目，导入springWeb与thymeleaf相关依赖，依赖如下：

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

2. 创建controller控制器，代码如下：

@Controller
public class ThymeleafController {

    @RequestMapping("/show")
    public String showInfo(Model model) {
        model.addAttribute("msg", "thymeleaf---AA--测试数据");
        model.addAttribute("key", new Date());
        return "index";  //返回值为视图名称
    }
}

在这里用的是model来与页面进行通信

3. 创建视图，目录如下：

在前后一体项目中，视图存放位置为“src/main/resource/templates”，该目录是安全的，因为该目录下的内容是不允许外界直接访问的。

下面是视图代码：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Thymeleaf学习</title>
</head>
<body>
    <span th:text="hello"></span>
    <hr>
    <span th:text="${msg}"></span>
    <hr>
    <input type="text" name="username" th:value="${msg}">
    <hr>
</body>
</html>