欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

荐 带你了解Thymeleaf

程序员文章站 2022-03-08 22:25:58
文章目录1、简单了解Thymeleaf2、SpringBoot整合Thymeleaf2.1、导入依赖2.2、配置.properties文件2.3、配置语法提示3、Thymeleaf常用语法3.1、表达式使用3.2、赋值取值3.3、th常用标签1、简单了解Thymeleaf  Thymeleaf简单的说,是一种模板引擎。模板引擎就是把模板文件和数据渲染成HTML显示的一种工具。具体可以看下图。常见的模板引擎有Thymeleaf、Freemarker等,而Spring官方推荐使用的是Thymeleaf这种模...

1、简单了解Thymeleaf

  Thymeleaf简单的说,是一种模板引擎。模板引擎就是把模板文件和数据渲染成HTML显示的一种工具。具体可以看下图。常见的模板引擎有Thymeleaf、Freemarker等,而Spring官方推荐使用的是Thymeleaf这种模板引擎,因为它的渲染效果更好。
  其实Thymeleaf与原来的JSP有许多的共同点,同时也有改进的地方。Thymeleaf也是有它自己一套的标签库,使用这些标签库,可以相对简单的从后端渲染页面内容,返回渲染好的页面,而不用选择ajax传递数据使用js来通过前端渲染页面。相对JSP,它更好的地方在于支持HTML5的一些新属性,同时前后端分离的程度也更高。
荐
                                                        带你了解Thymeleaf

2、SpringBoot整合Thymeleaf

2.1、导入依赖

  修改pom文件导入依赖

        <!-- https://mvnrepository.com/artifact/org.springframework.boot/spring-boot-starter-thymeleaf -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
            <version>2.3.1.RELEASE</version>
        </dependency>
2.2、配置.properties文件

  properties文件一定要设置,不然Thymeleaf找不到Templates文件下的HTML页面

#设置thymeleaf目录路径
spring.thymeleaf.prefix=classpath:/templates/
#关闭缓存,使修改后页面实时更新
spring.thymeleaf.cache=false
#查找.html结尾的文件
spring.thymeleaf.suffix=.html
#检查路径是否存在
spring.thymeleaf.check-template=true
#模板编码格式为html
spring.thymeleaf.mode=HTML
2.3、配置语法提示

  修改HTML页面的html标签,这样使用Thymeleaf标签时就会有语法提示了

<html lang="en" xmlns:th="http://www.thymeleaf.org">

3、Thymeleaf常用语法

3.1、表达式使用

  ${}表达式:用的最多的表达式,常用于取值。
  如现在,我们编写一个controller,通过model传递数据给模版引擎,在HTML页面上通过${}表达式获取传递的数据,渲染到对应的页面位置上。
  controller代码

@Controller
public class IndexController {

    @RequestMapping("/index")
    Object index(Model model){
        model.addAttribute("message","欢迎你!");
        return "index";
    }
}

  HTML页面代码

<p th:text="${message}">thymeleaf</p>

  通过key-value的获取方式,我们就可以获取message对应的内容,填充p标签中,并且覆盖掉原来的内容。

  @{}表达式:通常用于资源地址的获取。使用@{}表达式编写地址时,可以省略当前项目的名称,模板会自动添加项目名称。避免项目名称改变时,导致获取资源失败。

  HTML页面代码

<a th:href="@{http://www.baidu.com}">百度</a>
<a th:href="@{/login}">获取登录数据</a>

  ~{}表达式:通常用于获取一段公用的代码段,也就是代码复用。
  例如我把footer页面的代码替换到index页面的div中。
  footer.html页面代码

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div th:fragment="weibu">我是尾部</div>
</body>
</html>

  index.html页面代码

<div th:replace="~{footer::weibu}">替换</div>
3.2、赋值取值

  Thymeleaf赋值主要有两种,一种是获取controller传递的数据,另一种是在标签内部局部赋值。第一种赋值可见上面${}表达式的用法。这里介绍使用th:with标签局部赋值的方法。

    <div th:with="jia='广东'">
        <p th:text="${jia}"></p>
    </div>

  Thymeleaf取值一般使用${}表达式取值,通过th:text标签渲染到当前标签的内容处。

<p th:text="${message}">thymeleaf</p>
3.3、th常用标签

th:text----------替换标签内容,html标签转义
th:utext--------替换标签内容,html标签不转义
th:*--------------*可以是标签内任意属性,可以替换该属性的属性值
th:insert--------插入页面内容
th:replace------替换页面内容
th:include------只包含页面文字内容
th:each---------遍历对象
th:if--------------条件判断,为真的时候显示
th:unless-------条件判断,为假的时候显示
th:switch-------多选择语句,条件符合的时候显示,通常和th:case连用
th:case---------多选择语句,表示选项
th:with----------定义局部变量
th:onclick------定义点击事件

3.4、th常用内置对象

#request------HttpServletRequest对象
#response----HttpServletResponse对象
#session------HttpSession对象
#param--------获得请求地址栏参数对象

3.5、th常用工具类

#message--------------------消息工具类
#uris---------------------------地址工具类
#conversions----------------对象转换工具类
#dates-------------------------日期时间工具类
#calendars-------------------日历工具类
#numbers--------------------数字工具类
#strings-----------------------字符串工具类
#objects-----------------------对象工具类
#bools-------------------------布尔工具类
#arrays------------------------数组工具类
#lists---------------------------List工具类
#sets---------------------------Set工具类
#maps-------------------------Map工具类

每个工具类的方法就不一一列举了,有兴趣的朋友可以到官网查询具体api。

本文地址:https://blog.csdn.net/hailongcsdn/article/details/107324515