Thymeleaf常用语法实操

569 阅读1分钟

「这是我参与11月更文挑战的第2天,活动详情查看:2021最后一次更文挑战」。

一、 引入Thymeleaf

修改 html 标签用于引入 thymeleaf 引擎,这样才可以在其他标签里使用 th:* 语法,这是下面语法的前提。

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

二、变量表达式

  • 标准变量表达式

语法:

th:text="",获取变量值用{…}" ,获取变量值用 符号,对于javaBean的话使用变量名.属性名方式获取,这点和 EL 表达式一样。

    <p th:text="${msg}">显示信息</p>
    <p th:text="${user.name}">显示姓名</p>

原理

使用 th:text 标签的值替换 p 标签里面的值, p 里面的原有的值可以不写,(建议写出);对于前后端分离,写出原有标签值,可有效给出前端开发做展示使用或者以此依据。

注意:

$ 表达式只能写在th标签内部,不然不会生效。

  • 选择变量表达式

1.语法:

th:text="$*{…}" ,对于javaBean使用先获取对象,然后直接选择属性名的方式获取

 <div th:object="${user}">
        <p th:text="*{name}">姓名</p>
        <p th:text="*{age}">年龄</p>
        <p th:text="*{age}">性别</p>
    </div>

2.原理

使用th:object标签获取对象,通过在原标签的子标签下,使用th:text=$*{…}语法选择需要的属性。

  • URL表达式

1.语法:

th:href=@{...} , Thymeleaf对于 URL 的处理是通过语法 @{…} 来处理的

访问错误页面:改变上下文路径
<a href="error/error">404.html</a>   //相对路径,作用域仅在当前项目
<a href="/error/error">404.html</a>   //绝对路径  ,上下文路径改变时会报错
<a th:href="@{error/error}" >404.html</a>  绝对路径(用@{}拼接),帮我们加上改变后的上下文路径

2.作用

thymeleaf th:href / 时会帮我们加上上下文路径 ,因此建议所有thymeleaf路径使用:绝对路径(用@{}拼接)。

访问页面:<br/>
<a href="/404.html">404.html</a>
<a href="/index/index"  th:href="@{|/index/index?a=21&b=${msg1}|}" >查看标签</a>

表达式工具对象

  • #dates 与java.util.Date对象的方法对应,格式化、日期组件抽取等等
  • #calendars 类似#dates,与java.util.Calendar对象对应
  • #numbers 格式化数字对象的工具方法
  • #strings 与java.lang.String对应的工具方法:contains、startsWith、prepending/appending等等
  • #objects 用于对象的工具方法
  • #bools 用于布尔运算的工具方法
  • #arrays 用于数组的工具方法
  • #lists 用于列表的工具方法
  • #sets 用于set的工具方法
  • #maps 用于map的工具方法
  • #aggregates 用于创建数组或集合的聚合的工具方法
  • #messages 用于在变量表达式内部获取外化消息的工具方法,与#{…}语法获取的方式相同
  • #ids 用于处理可能重复出现(例如,作为遍历的结果)的id属性的工具方法

字符串连接

一、字符串拼接操作单引号:

<span th:text="'我的字符串数据:'+${msg}">数据信息</span>

二、简洁方式:|...|

<span th:text="|我的字符串数据${msg}|">数据信息</span>

行内编写

标准方言允许我们使用标记属性来完成几乎所有的操作,那行内编写为什么还是我们更喜欢的表达式呢?

因为在某些情况下表达式直接编写到HTML文本中,更符合实际需求,美观度,简洁性等方面使用行内编写更符合大众的审美标准。例如,我们可能更喜欢这样写:


标记属性:<p>Hello, <span th:text="${session.user.name}">Sebastian</span>!</p>

行内编写:<p>Hello, [[${user.name}]]!</p>

总结

thymleaf常见的语法表达式,需要和标签以及属性合理的运用,可以解决很多前后端分离出现的交流问题,可以使用thymeleaf很简洁的代替ajax等前端网页技术实现数据动态交互部分的操作。