Thymeleaf模板引擎的理解以及使用（轻松掌握）

最新推荐文章于 2025-05-03 15:57:46 发布

小码飞飞

最新推荐文章于 2025-05-03 15:57:46 发布

阅读量4.9k

点赞数 5

CC 4.0 BY-SA版权

分类专栏： spring boot 文章标签： java spring

本文链接：https://blog.youkuaiyun.com/liuDuke1/article/details/108508006

spring boot 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了Thymeleaf模板引擎的基本概念、特点和使用方法，包括添加依赖、配置、模型准备、控制器开发、页面开发等步骤。Thymeleaf是一个适用于Web和独立环境的Java模板引擎，以其动静结合、开箱即用和与Spring Boot的完美整合等特性，成为现代HTML5 JVM Web开发的理想选择。

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

前言

开心的一天从学习新的技术开始，哦也，冲冲冲
在这里插入图片描述

提示：以下是本篇文章正文内容，下面案例可供参考

一、模板引擎是什么？

模板引擎（这里特指用于Web开发的模板引擎）是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的HTML文档。

模板引擎不属于特定技术领域，它是跨领域跨平台的概念。在Asp下有模板引擎，在PHP下也有模板引擎，在C#下也有，甚至JavaScript、WinForm开发都会用到模板引擎技术。

二、Thymeleaf的介绍

Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎。

Thymeleaf的主要目标是为您的开发工作流程带来优雅的自然模板 -HTML可以在浏览器中正确显示，也可以作为静态原型工作，从而可以在开发团队中加强协作。

Thymeleaf拥有用于Spring Framework的模块，与您喜欢的工具的大量集成以及插入您自己的功能的能力，对于现代HTML5 JVM Web开发而言，Thymeleaf是理想的选择-尽管它可以做很多事情。

三、Thymeleaf的特点

动静结合
页面采用模板+数据的方式，在前端美工手中，可以展示静态页面。在后台开发人员手中，也可以展示数据返回到页面后的界面。这是因为thymeleaf支持html原型，可以在原型上添加额外的属性，浏览器在解释html时会忽视未定义的属性，当定义的属性有值时就会动态替换静态页面，来实现动态展示。
开箱即用
它提供标准和spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果，
避免每天套模板、改jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
多方言支持
Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块，可以快速的实现表单绑定、属性编辑器、国际化等功能。
与SpringBoot完美整合
SpringBoot提供了Thymeleaf的默认配置，并且为Thymeleaf设置了视图解析器，我们可以像以前操作jsp一样来操作Thymeleaf。代码几乎没有任何区别，就是在模板语法上有区别。

四、Thymeleaf的使用

环境：

Spring Boot项目
Maven中添加依赖（Thymeleaf启动器）
Mybatis-Plus持久层访问

1.添加依赖

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

2.添加配置

spring.thymeleaf.cache=false

关闭thymeleaf的缓存，不然在开发过程中修改页面不会立刻生效需要重新启动，开发完之后可以改为true，可以帮助客户加速访问

3.准备模型

3.1 实体类

@Data
//注解在类上,指数据库表名(实体类与表名不一致时需要指定)
@TableName("sys_user")
public class SysUser {
    //表示主键自增长
    @TableId(type = IdType.AUTO)
    //指数据库字段名(不满足默认匹配规则是需要指定)
    @TableField("user_id")
    private long userId;
    private String userName;
    private String userPassword;
    private long userRoleId;
    private long userFlag;
}

3.2 Mapper接口

public interface SysUserMapper extends BaseMapper<SysUser> {}

3.3 业务层

public interface SysUserService {
    public SysUser login(String userName,String userPassword);
}

@Service
public class SysUserServiceImpl implements SysUserService {
    @Override
    public SysUser login(String userName, String userPassword) {
        QueryWrapper<SysUser> wrapper = new QueryWrapper();
        wrapper.eq("user_name", userName);
        wrapper.eq("user_password", userPassword);
        return sysUserMapper.selectOne(wrapper);
    }
}

4.控制器开发

@Controller
public class MockController {

    @Autowired
    SysUserService sysUserService;
    
  	@PostMapping("login")
    public String login(String userName, String userPassword, Model model, HttpSession session){
        if (sysUserService.login(userName,userPassword)!=null){
            session.setAttribute("user",sysUserService.login(userName,userPassword));
            session.setAttribute("userName",userName);
            return "main";
        }
        model.addAttribute("login","登录失败");
        session.setAttribute("user",null);
        return "index";
    }
｝

5.页面开发

index.html

       <form action="login" method="post">
                    <h1>APP开发者平台</h1>
                    <div>
                        <input type="text" class="form-control" name="userName" placeholder="请输入用户名" required=""
                               value="test"/>
                    </div>
                    <div>
                        <input type="password" class="form-control" name="userPassword" placeholder="请输入密码" required=""
                               value="123456"/>
                    </div>
                    <span th:text="${login}"></span>
                    <div>
                        <button type="submit" class="btn btn-success">登 录</button>
                        <button type="reset" class="btn btn-default">重　填</button>
                    </div>

                    <div class="clearfix"></div>

                    <div class="separator">
                        <div>
                            <p>©2016 All Rights Reserved. </p>
                        </div>
                    </div>
                </form>

6.运行访问

main.html

<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Title</title>
</head>
<body>
<h1>登录成功，欢迎你<span th:text="${session.userName}"></span></h1>

<div th:replace="layout::aa"></div>
</body>
</html>

在这里插入图片描述
结果

五、Thymeleaf的配置

#spring.thymeleaf.cache = true ＃启用模板缓存。

#spring.thymeleaf.check-template = true ＃在呈现模板之前检查模板是否存在。

#spring.thymeleaf.check-template-location = true ＃检查模板位置是否存在。

#spring.thymeleaf.content-type = text / html ＃Content-Type值。

#spring.thymeleaf.enabled = true ＃启用MVC Thymeleaf视图分辨率。

#spring.thymeleaf.encoding = UTF-8 ＃模板编码。

#spring.thymeleaf.excluded-view-names = ＃应该从解决方案中排除的视图名称的逗号分隔列表。

#spring.thymeleaf.mode = HTML5 ＃应用于模板的模板模式。另请参见StandardTemplateModeHandlers。

#spring.thymeleaf.prefix = classpath：/ templates / ＃在构建URL时预先查看名称的前缀。

#spring.thymeleaf.suffix = .html ＃构建URL时附加到查看名称的后缀。

#spring.thymeleaf.template-resolver-order = ＃链中模板解析器的顺序。

#spring.thymeleaf.view-names = ＃可以解析的视图名称的逗号分隔列表。/ templates / ＃在构建URL时先查看名称的前缀。
#spring.thymeleaf.suffix = .html ＃构建URL时附加到查看名称的后缀。

#spring.thymeleaf.template-resolver-order = ＃链中模板解析器的顺序。

#spring.thymeleaf.view-names = ＃可以解析的视图名称的逗号分隔列表。/ templates / ＃在构建URL时先查看名称的前缀。

#spring.thymeleaf.suffix = .html ＃构建URL时附加到查看名称的后缀。

#spring.thymeleaf.template-resolver-order = ＃链中模板解析器的顺序。

#spring.thymeleaf.view-names = ＃可以解析的视图名称的逗号分隔列表。