Thymeleaf根本不需要看视频学习,看完这篇文章就够了

Thymeleaf简介

Thymeleaf是一个XML/XHTML/HTML5模板引擎,可用于Web非Web环境中的应用开发。它是一个开源的Java库,基于Apache License 2.0许可,由Daniel Fernández创建,该作者还是Java加密库Jasypt的作者。

Thymeleaf提供了一个用于整合Spring MVC的可选模块,在应用开发中,你可以使用Thymeleaf来完全代替JSP,或其他模板引擎,如VelocityFreeMarker等。Thymeleaf的主要目标在于提供一种可被浏览器正确显示的、格式良好的模板创建方式,因此也可以用作静态建模。你可以使用它创建经过验证的XMLHTML模板。相对于编写逻辑或代码,开发者只需将标签属性添加到模板中即可。接下来,这些标签属性就会在DOM(文档对象模型)上执行预先制定好的逻辑。

1、变量

<p>Today is: <span th:text="${today}">13 february 2011</span>.</p>

意味着 标签中的内容会被表达式$ {today}的值所替代,无论模板中它的内容是什么,之所以在模板中“多此一举“地填充它的内容,完全是为了它能够作为原型在浏览器中直接显示出来。
假设today的值为2015年8月14日,那么渲染结果为:< p>Today is: 2015年8月14日.< /p>。可见Thymeleaf的基本变量和JSP一样,都使用 ${.} 表示获取变量的值。

2、URL

URL在Web应用模板中占据着十分重要的地位,需要特别注意的是Thymeleaf对于URL的处理是通过语法 @{…} 来处理的。Thymeleaf支持绝对路径URL

<a th:href="@{http://www.thymeleaf.org}">Thymeleaf</a>

同时也能够支持相对路径URL:

另外,如果需要Thymeleaf对URL进行渲染,那么务必使用th:href,th:src等属性,下面是一个例子

<!-- Will produce 'http://localhost:8080/gtvg/order/details?orderId=3' (plus rewriting) -->
<a href="details.html" 
   th:href="@{http://localhost:8080/gtvg/order/details(orderId=${o.id})}">view</a>
<!-- Will produce '/gtvg/order/details?orderId=3' (plus rewriting) -->
<a href="details.html" th:href="@{/order/details(orderId=${o.id})}">view</a>
<!-- Will produce '/gtvg/order/3/details' (plus rewriting) -->
<a href="details.html" th:href="@{/order/{orderId}/details(orderId=${o.id})}">view</a>

几点说明:

上例中URL最后的 (orderId=${o.id}) 表示将括号内的内容作为URL参数处理,该语法避免使用字符串拼接,大大提高了可读性 @{…} 表达式中可以通过 {orderId} 访问Context中的orderId变量 @{/order}Context相关的相对路径,在渲染时会自动添加上当前Web应用的Context名字,假设context名字为app,那么结果应该是/app/order

3、字符串替换

很多时候可能我们只需要对一大段文字中的某一处地方进行替换,可以通过字符串拼接操作完成:

<span th:text="'Welcome to our application, ' + ${user.name} + '!'">

一种更简洁的方式是:

<span th:text="|Welcome to our application, ${user.name}!|">

当然这种形式限制比较多,|…|中只能包含变量表达式${…},不能包含其他常量、条件表达式等。

4、运算符

在表达式中可以使用各类算术运算符,例如+, -, *, /, %

th:with="isEven=(${prodStat.count} % 2 == 0)"

逻辑运算符>, <, <=,>=,==,!=都可以使用,唯一需要注意的是使用<,>时需要用它的HTML转义符:

th:if="${prodStat.count} &gt; 1"
th:text="'Execution mode is ' + ( (${execMode} == 'dev')? 'Development' : 'Production')"

thymeleaf常用th标签

关键字功能案例
th:id替换id<input th:id="'xxx' + ${collect.id}"/>
th:text文本替换,包括html标签home.welcome=Welcome to our <b>fantastic</b> grocery store!
<p th:text="#{home.welcome}"></p>解析结果为:
<p>Welcome to our <b>fantastic</b> grocery store!</p>
th:utext文本替换,html标签会显示出正确的样式<p th:utext="#{home.welcome}"></p>即可
Welcome to our fantastic grocery store!
等效于html:<p>Welcome to our <b>fantastic</b> grocery store!</p>
th:object替换对象用于表单数据对象绑定,将表单绑定到后台controller的一个JavaBean参数。常与th:field一起使用进行表单数据绑定。
例如:
public class LoginBean implements Serializable{
@RequestMapping(value = "/login", method = RequestMethod.POST)
public String login(@ModelAttribute(value = "loginBean") LoginBean loginBean,ModelMap model) {...}
< form id=“login-form” th:action="@{/login}" th:object="${loginBean}">…< /form>
th:value属性赋值<input th:value = "${user.name}" />
th:with定义局部变量<div th:with="firstPer=${persons[0]}">
<p>The name of the first person is <span th:text="${firstPer.name}">Julius Caesar</span>.</p>
</div>
当th:with被处理,firstPer变量创建一个局部变量和变量添加到map自上下文,
以便它是用于评估和其他上下文中声明的变量从开始,但只有包含< div >标记的范围内。
如果定义多个局部变量
<div th:with="firstPer=${persons[0]},secondPer=${persons[1]}">
th:style设置样式<div th:style="'display:' + @{(${sitrue} ? 'none' : 'inline-block')} + ''"></div>
th:onclick点击事件<td th:onclick = "'getCollect()'"></td>
th:each属性赋值<tr th:each = "user,userStat:${users}">
th:if判断条件<a th:if = "${userId}"> 如果userId不为空就执行a标签
th:unless和th:if判断相反<a th:href="@{/login} th:unless=${session.user != null}">Login</a>
th:href链接地址<a th:href="@{/login}" th:unless=${session.user != null}>Login</a>
th:switch多路选择配合th:case使用<div class="col-sm-9">
  <div th:switch="${channel.enable}">
    <p th:case="'1'">
      <input id="enable" name="enable" type="radio" class="ace" value="1" checked="checked" />
      <span class="lbl">启用</span>
      <input id="enable1" name="enable" type="radio" class="ace" value="0" />
      <span class="lbl">停用</span>
    </p>
    <p th:case="'0'">
      <input id="enable2" name="enable" type="radio" class="ace" value="1" />
      <span class="lbl">启用</span>
      <input id="enable3" name="enable" type="radio" class="ace" value="0" checked="checked" />
      <span class="lbl">停用</span>
    </p>
  </div>
</div>
th:fragment自定义片段定义fragment
所有的fragment可以写在一个文件里面,也可以单独存在,例如
<footer th:fragment="copy">
the content of footer
</footer>
fragment的引用
th:insert:保留自己的主标签,保留th:fragment的主标签。
th:replace:不要自己的主标签,保留th:fragment的主标签。
th:include:保留自己的主标签,不要th:fragment的主标签。(官方3.0后不推荐)
  导入片段:
<div th:insert="footer :: copy"></div>
<div th:replace="footer :: copy"></div>
<div th:include="footer :: copy"></div>

 结果为:
<div>
  <footer>
   the content of footer
  </footer>
</div>

  <footer>
   the content of footer
  </footer>

<div>
   the content of footer
</div>
th:replace=”thymeleaf的根目录+片段的html名+ :: +自定义的片段名”
th:include布局标签,替换内容到引入的文件<head th:include="layout :: htmlhead" th:with="title='xx'"></head> />
th:replace布局标签,替换整个标签到引入的文件<div th:replace="fragments/header :: title"></div>
th:selectdselected选择框选中th:selected="(${xxx.id} == ${configObj.dd})"
th:src图片类地址引入<img class="img-responsive" alt="App Logo" th:src="@{/img/logo.png}" />
th:inline定义js脚本可以使用变量<script type="text/javascript" th:inline="javascript">
th:action表单提交的地址<form action="subscribe.html" th:action="@{/subscribe}">
th:remove删除某个属性<tr th:remove="all">
1.all:删除包含标签和所有的孩子。
2.body:不包含标记删除,但删除其所有的孩子。
3.tag:包含标记的删除,但不删除它的孩子。
4.all-but-first:删除所有包含标签的孩子,除了第一个。
5.none:什么也不做。这个值是有用的动态评估
th:attr设置标签属性,多个属性可以用逗号分隔比如 th:attr="src=@{/image/aa.jpg},title=#{logo}",此标签不太优雅,一般用的比较少。
  • 6
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Thymeleaf是一个流行的Java服务器端模板引擎,用于在Web开发中动态生成HTML页面。它允许开发人员将业务逻辑和页面模板结合,使得前后端开发更加灵活和高效。 首先,Thymeleaf与传统的JSP相比,具有更加简洁的语法和更好的可读性。Thymeleaf使用自然的HTML语法,并采用属性型的编程方式,从而使得模板文件更易于理解和维护。它还提供了丰富的标签库和表达式语言,可以方便地进行逻辑判断、循环遍历和数据绑定等操作。 其次,Thymeleaf具有强大的扩展性和可定制性。它支持自定义标签和表达式,可以根据项目的需求进行二次开发。开发者可以自定义标签库,将通用的HTML组件封装成标签,提高代码的复用性。此外,Thymeleaf还支持国际化和主题切换等功能,可以方便地实现多语言和多样式的页面。 另外,Thymeleaf还具有良好的与Spring框架的集成能力。它可以与Spring MVC无缝集成,利用Spring的依赖注入和AOP等特性,更好地处理请求和响应。在Spring Boot项目中使用Thymeleaf,只需添加相应的依赖和配置,即可快速搭建起一个整的Web应用。 总结来说,Thymeleaf是一个功能强大且易于使用的模板引擎,可以大大简化Web开发的工作量。它具有简洁的语法、强大的扩展性和与Spring框架的良好集成能力,使得开发人员可以更加方便地实现动态页面的生成和展示。无论是小型项目还是大型企业级应用,Thymeleaf都是一个值得推荐的选择。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值