您的位置: 首页  >  文章  >  SpringBoot+Thymeleaf使用简单介绍

SpringBoot+Thymeleaf使用简单介绍

分类: 文章 • 2024-03-16 12:59:46

一、什么是【Thymeleaf】

1、1Thymeleaf介绍：SpringBoot并不推荐使用jsp,Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎，它可以完全替代 JSP。

1、2Thymeleaf特点：

1、2、1动静结合：

1）Thymeleaf 在有网络和无网络的环境下皆可运行;

2)它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果;

3)这是由于它支持 html 原型，然后在 html 标签里增加额外的属性来达到模板+数据的展示方式;

4)浏览器解释 html 时会忽略未定义的标签属性，所以 thymeleaf 的模板可以静态地运行；

5)当有数据返回到页面时，Thymeleaf 标签会动态地替换掉静态内容，使页面动态显示。

1、2、2开箱即用：

1）它提供标准和spring标准两种方言，可以直接套用模板实现JSTL、 OGNL表达式效果；

2）避免每天套模板、该jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。

1、2、3多方言支持：

1）Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块；

2）可以快速的实现表单绑定、属性编辑器、国际化等功能。

1、2、4与SpringBoot完美整合：

1）SpringBoot提供了Thymeleaf的默认配置；

2）为Thymeleaf设置了视图解析器，我们可以像以前操作jsp一样来操作Thymeleaf。

二、如何使用

2、1添加启动器：

在pom.xml文件添加以下内容

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

2、2创建模板文件夹：

默认位置：SpringBoot+Thymeleaf使用简单介绍

【注：用快捷键Ctrl + Shift + n，弹出框输入ThymeleafProperties，就可以看到默认设置内容了】

thymeleaf属于spring，在application.yml的配置文件里加入以下内容，配置缓存，模式，编码
thymeleaf:
  cache: false
  mode: HTML5
  encoding: UTF-8

2、3引入名称空间

在html文件中加入以下内容：

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

SpringBoot+Thymeleaf使用简单介绍

2、4如何传值

使用spring【org.springframework.ui.Model】的Model接口对象进行传值，接口有如下方法

 

SpringBoot+Thymeleaf使用简单介绍SpringBoot+Thymeleaf使用简单介绍

三、【th】标签具有的功能点

3、1——表达式：

    3、1、1${}:变量表达式 th:text="${变量名或者对象的属性名}"；

    3、1、2*{} ：选择变量表达式 th:obiect="${对象}" th:text="*{对象的属性名}"

    3、1、3#{...} : Message 表达式

3、2——URL：

    3、2、1绝对网址:绝对URL用于创建到其他服务器的链接,它们需要指定一个协议名称(http://或https://)开头，

例：<a th:href="@{https://www.baidu.com/}">

    3、2、2上下文相关URL：与Web应用程序根相关联URL，<a th:href="@{/test}">test</a>

    3、2、3与服务器相关URL，<a th:href="@{~/test}">test</a>【注：~【esc】下面那个键上面的值】

    【注关于URL区别：https://blog.csdn.net/qq_34316768/article/details/99446900】如有侵权，联系删除

    3、2、4携带参数<a th:href="@{/test/detail(id=3,action='show_all')}">show</a>

3、3——字面值：有的时候，我们需要在指令中填写基本类型如：字符串、数值、布尔等，并不希望被Thymeleaf解析为变量，这个时候称为字面值。

    3、3、1字符串字面值：<p th:text="'固定值'"></p>

    3、3、2数字字面值：<p th:text="1+1"></p>

    3、3、3布尔字面值：布尔类型的字面值是true或false

3、4——字符串连接变量

    3、4、1：<p th:text="${'固定值'+变量名}"></p>

    3、4、2：<p th:text="'固定值'+${变量名}"></p>

    3、4、3：<p th:text="|'固定值'${变量名}|"></p>

3、5——运算符

    3、5、1：算术操作符 + - * / %

    3、5、2：比较运算> ：gt，< ：lt，>= ：ge，<=： le

    3、5、3：三元运算：conditon ? then : else

3、6——内联写法

    3、6、1解析内部的标签[(${变量名})]

    3、6、2原样输出[[${变量名}]]

3、7局部变量

    3、7、1当th:with被处理,test变量创建一个局部变量和变量添加到map自上下文,以便它是用于评估和其他上下文中声明的变量从开始,但只有包含< div >标记的范围内。

<div th:with="test=${tests[0]}">

   <p th:text="${test.testName}"></p>
</div>

3、8判断

    3、8、1：th:if    

        <p th:if="${true}">我是真的</p>

        <p th:if="${false}">我是假的不显示</p>

    3、8、2：th:unless 

     <p th:unless="${false}">我是假的才显示</p>

    3、8、3：th:switch

    <div th:switch="${key1}">
       <p th:case="'value1'">value1</p>
       <p th:case="'value2'">value2</p>
       <p th:case="*">final</p>
    </div>

3、9迭代

3、9、1
<div th:each="test,stat:${tests}">
   <p th:text="${test.testId}"></p>
   <p th:text="${test.testName}"></p>
   <p th:text="${stat.even}">奇数</p>
</div>

3、9、2

    stat对象包含以下属性：

        3、9、2、1：index，从0开始的角标

        3、9、2、2：count，元素的个数，从1开始

        3、9、2、3：size，总元素个数

        3、9、2、4： current，当前遍历到的元素

        3、9、2、5：even/odd，返回是否为奇偶，boolean值

        3、9、2、6：first/last，返回是否为第一或最后，boolean值

3、10内置对象

    3、10、1环境相关对象

        3、10、1、1 ：${#ctx} 上下文对象，可用于获取其它内置对象。

        3、10、1、1：${#vars}:    上下文变量。

        3、10、1、1：${#locale}：上下文区域设置。

        3、10、1、1：${#request}: HttpServletRequest对象。

        3、10、1、1：${#response}: HttpServletResponse对象。

        3、10、1、1：${#session}: HttpSession对象。

        3、10、1、1：${#servletContext}:  ServletContext对象。

    3、10、2全局对象功能

        3、10、2、1：#strings：字符串工具类

        3、10、2、2：#lists：List 工具类

        3、10、2、3：#arrays：数组工具类

        3、10、2、4：#sets：Set 工具类

        3、10、2、5：#maps：常用Map方法。

        3、10、2、6：#objects：一般对象类，通常用来判断非空

        3、10、2、7：#bools：常用的布尔方法。

        3、10、2、8：#execInfo：获取页面模板的处理信息。

        3、10、2、9：#messages：在变量表达式中获取外部消息的方法，与使用＃{...}语法获取的方法相同。

        3、10、2、10：#uris：转义部分URL / URI的方法。

        3、10、2、11;#conversions：用于执行已配置的转换服务的方法。

        3、10、2、12；#dates：时间操作和时间格式化等。

        3、10、2、13：#calendars：用于更复杂时间的格式化。

        3、10、2、14;#numbers：格式化数字对象的方法。

        3、10、2、15；#aggregates：在数组或集合上创建聚合的方法。

        3、10、2、16：#ids：处理可能重复的id属性的方法。

    3、10、3示例
        ${#strings.abbreviate(str,10)}  str截取0-10位，后面的全部用…这个点代替，注意，最小是3位
        ${#strings.toUpperCase(name)}
3、11布局

    3、11、1方式1：

SpringBoot+Thymeleaf使用简单介绍SpringBoot+Thymeleaf使用简单介绍

    3、11、2方式2：

SpringBoot+Thymeleaf使用简单介绍SpringBoot+Thymeleaf使用简单介绍

    3、11、3引入方式：

        3、11、3、1th:insert (将公共的标签及内容插入到指定标签当中)；

        3、11、3、2th:replace(将公共的标签替换指定的标签)；

        3、11、3、3th:include(将公共标签的内容包含到指定标签当中)。

    3、11、4传值：

SpringBoot+Thymeleaf使用简单介绍SpringBoot+Thymeleaf使用简单介绍

3、12js模板

模板引擎不仅可以渲染html，也可以对JS中的进行预处理。而且为了在纯静态环境下可以运行，在script标签中通过th:inline="javascript"来声明这是要特殊处理的js脚本

SpringBoot+Thymeleaf使用简单介绍

相关推荐