thymeleaf

╰半夏微凉° 2024-04-01 13:03 53阅读 0赞

## 一、Thymeleaf简介 ##

*  Thymeleaf是用来开发Web和独立环境项目的服务器端的Java模版引擎
 *  Spring官方支持的服务的渲染模板中，并不包含jsp。而是Thymeleaf和Freemarker等，而Thymeleaf与SpringMVC的视图技术，及SpringBoot的自动化配置集成非常完美，几乎没有任何成本，你只用关注Thymeleaf的语法即可。

## 二、Thymeleaf的特点 ##

*  动静结合：Thymeleaf 在有网络和无网络的环境下皆可运行，即它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持 html 原型，然后在 html 标签里增加额外的属性来达到模板+数据的展示方式。浏览器解释 html 时会忽略未定义的标签属性，所以 thymeleaf 的模板可以静态地运行；当有数据返回到页面时，Thymeleaf 标签会动态地替换掉静态内容，使页面动态显示。
 *  开箱即用：它提供标准和spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果，避免每天套模板、该jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
 *  多方言支持：Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块，可以快速的实现表单绑定、属性编辑器、国际化等功能。
 *  与SpringBoot完美整合，SpringBoot提供了Thymeleaf的默认配置，并且为Thymeleaf设置了视图解析器，我们可以像以前操作jsp一样来操作Thymeleaf。代码几乎没有任何区别，就是在模板语法上有区别。

## 三.ssm中添加thymeleaf ##

#### 1.导入jar包 ####

<dependency>
      <groupId>org.thymeleaf</groupId>
      <artifactId>thymeleaf</artifactId>
      <version>3.0.9.RELEASE</version>
    </dependency>
    
    <dependency>
      <groupId>org.thymeleaf</groupId>
      <artifactId>thymeleaf-spring4</artifactId>
      <version>3.0.9.RELEASE</version>
    </dependency>

#### 2.在springmvc.xml文件中设置视图解析器为thymeleaf解析 ####

<bean id="templateResolver"
    
          class="org.thymeleaf.spring4.templateresolver.SpringResourceTemplateResolver">
    
        <property name="prefix" value="/WEB-INF/views/" />
    
        <property name="suffix" value=".html" />
    
        <property name="templateMode" value="HTML" />
    
        <property name="cacheable" value="false" />
    
        <property name="characterEncoding" value="UTF-8"/>
    
    </bean>
    
    <bean id="templateEngine"
    
          class="org.thymeleaf.spring4.SpringTemplateEngine">
    
        <property name="templateResolver" ref="templateResolver" />
    
    </bean>
    
    <bean class="org.thymeleaf.spring4.view.ThymeleafViewResolver">
    
        <property name="templateEngine" ref="templateEngine" />
    
        
    
        <property name="characterEncoding" value="UTF-8"/>
    
    </bean>

#### 3.删除之前视图解析器为jsp的配置信息,如果两个都配置，谁在前面，用谁 ####

#### 4.配置web.xml文件中thymeleaf部分 ####

<context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext-ioc.xml</param-value>
      </context-param>
      
      <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
      </listener>
     
     <servlet>
      <servlet-name>springMVC</servlet-name>
      <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    
      
    
      <init-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:springmvc.xml</param-value>
      </init-param>
    
      <load-on-startup>1</load-on-startup>
    </servlet>
    
    <servlet-mapping>
      <servlet-name>springMVC</servlet-name>
      <url-pattern>/</url-pattern> 
    </servlet-mapping>
    
    
    
    <servlet-mapping>
    
      <servlet-name>springMVC</servlet-name>
    
      <url-pattern>*.html</url-pattern>
    
    </servlet-mapping>

#### 5.创建控制器 ####

package com.test.action;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.RequestMapping;
    
    @Controller
    @RequestMapping("thymeleaf")
    public class ThymeleafAction {
    
        @RequestMapping("/testThymeleaf")
        public String testThymeleaf(Model model)
        {
            model.addAttribute("uname","zhangsan");
    
            return "testThymeleaf";// WEB-INF/views/testThymeleaf.html
        }
    }

#### 6.创建html页面 ####

根据之前设置的前缀

在web-inf/views/文件夹下创建html文件

访问传递过来的数据，注意声明Thymeleaf命名空间

<!DOCTYPE html>
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml" 
          xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <h1 th:text="${uname}">aaaa</h1>
    </body>
    </html>

#### 7.测试 ####

http://localhost:8080/testssm/thymeleaf/testThymeleaf

成功

## 张三 ##

## 四.常用th属性解读 ##

html有的属性，Thymeleaf基本都有，而常用的属性大概有七八个。其中th属性执行的优先级从1~8，数字越低优先级越高。

一、**th:text** ：设置当前元素的文本内容，相同功能的还有**th:utext**，两者的区别在于前者不会转义html标签，后者会。优先级不高：order=7

二、**th:value**：设置当前元素的value值，类似修改指定属性的还有**th:src**，**th:href**。优先级不高：order=6

三、**th:each**：遍历循环元素，和th:text或th:value一起使用。注意该属性修饰的标签位置，详细往后看。优先级很高：order=2

四、**th:if**：条件判断，类似的还有**th:unless**，**th:switch**，**th:case**。优先级较高：order=3

五、**th:insert**：代码块引入，类似的还有**th:replace**，**th:include**，三者的区别较大，若使用不恰当会破坏html结构，常用于公共代码块提取的场景。优先级最高：order=1

六、**th:fragment**：定义代码块，方便被th:insert引用。优先级最低：order=8