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

谁借莪１个温暖的怀抱￠ 2022-12-05 12:04 88阅读 0赞

### 文章目录 ###

*  前言
 *  一、模板引擎是什么？
 *  二、Thymeleaf的介绍
 *  三、Thymeleaf的特点
 *  四、Thymeleaf的使用
 *   *  1.添加依赖
     *  2.添加配置
     *  3.准备模型
     *  4.控制器开发
     *  5.页面开发
     *  6.运行访问
 *  五、Thymeleaf的配置
 *  六、Thymeleaf的常用标签
 *  七、Thymeleaf的表达式

--------------------

# 前言 #

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

--------------------

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

# 一、模板引擎是什么？ #

模板引擎（这里特指用于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>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdUR1a2Ux_size_16_color_FFFFFF_t_70_pic_center 1]  
结果  
![在这里插入图片描述][20200910111422840.png_pic_center]

# 五、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 = ＃可以解析的视图名称的逗号分隔列表。

# 六、Thymeleaf的常用标签 #

# 七、Thymeleaf的表达式 #

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdUR1a2Ux_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/6e8aad24d3c94904aa3b012d14901fad.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpdUR1a2Ux_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221123/24ba2cd55cd94320a969ecb8bb3acbee.png
[20200910111422840.png_pic_center]: /images/20221123/170f4bd2fdbe49568c374200aeed9214.png