Thymeleaf框架,这是一个较为新颖的模板引擎。使用Thymeleaf,可以完全抛弃JSP,进入一种更为简便的页面开发模式。
说白了,就是一款致力于前后交互的框架,可以使用类似于JSTL标签的标签进行数据的显示。可以简单的理解为升级版的JSTL,完全取代JSP的新技术。
第一,Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。
这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板+数据的展示方式。浏览器解释 html 时会忽略未定义的标签属性,所以 thymeleaf 的模板可以静态地运行;当有数据返回到页面时,Thymeleaf 标签会动态地替换掉静态内容,使页面动态显示。
第二,Thymeleaf 开箱即用的特性。它提供标准和spring标准两种方言,可以直接套用模板实现JSTL、 OGNL表达式效果,避免每天套模板、该jstl、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
第三,Thymeleaf 提供spring标准方言和一个与 SpringMVC 完美集成的可选模块,可以快速的实现表单绑定、属性编辑器、国际化等功能。
举个例子:
jsp
如果在使用each
迭代时,更是要使用到c标签库
而thymeleaf
则使用th:each="user:${user}"
,不需要像jsp一样引入很多标签库
再问个问题:如果要在jsp
页面中获取当前时间怎么办??
大家想一下,是不是有些复杂?
而thymeleaf
拥有强大的内置工具,只要使用th:text="#dates.format(date,"yyyy-MM-dd")"
即可获取时间
再比如:jsp
页面,无法进行选择操作,而thymeleaf
可以使用th:switch="${sex}" th:case="0"
来实现选则操作,控制页面内容。
以及进行判断的th:if="${session.user!=null}"
等来进行显示的判断操作。
第一步:加入依赖
在maven的pom文件添加如下依赖,进行更新即可。
<dependency>
<groupId>org.springframework.bootgroupId>
<artifactId>spring-boot-starter-thymeleafartifactId>
dependency>
第二步:使用
Thymeleaf
一般是配合HTML
进行一个Thymeleaf+HTML
的前端开发配套使用。
把html标签里,改为如下:
<html lang="en" xmlns:th="http://www.thymeleaf.org">html>
它的基础语法如下:
对象数据
th:text="${user.username}"
th:text="${user['username']}"
th:object="${user}" th:text="*{username}"
list集合数据
th:text="${list.get(0)}"
th:text="${list[1]}"
map集合数据
th:text="${map['key1']}"
th:text="${map.key2}"
静态资源
src="/static/imgs/1.jpg"
模板的内置对象
th:text="${#session.getAttribute('sessionuser').username}"
th:text="${session.sessionuser.username}"
工具内置对象
th:text="${#dates.format(date,'yyyy-MM-dd')}"
th:text="${#dates.createNow()}"
th:text="${#dates.createToday()}"
URL链接
th:src="@{/static/imags/1.jpg}"
th:href="@{/url(username=jack,password=123)}"
th:href="@{/url/{username}/{password}(username=tom,password=000)}"
if的使用
th:if="${sex==0}"
switch case的使用
th:switch="${sex}"
th:case="0"
算术运算
th:text="${1+2}"
定义参数
th:with="sum=2+2" th:text="${sum}"
迭代
th:each="str:${list}"
th:text="${str}"
三目运算符
th:text="${sex==0?'男':'女'}"
样式操作
th:class="red"
value属性
th:type="text" th:value="请输入用户名"
布尔值修复
th:checked="${sex==0}"
js的onclick方法
h:onclick="'buy('+${pro.pid}+','+${pro.price}+')'"
我们来写一个简单的例子吧。(以下例子需有SpringMVC基础)
controller
controller写一个映射路径为test的方法,返回名字为test.html(博主在yml中配置了后缀,所以没有加上.html后缀)的前端页面并设置model值。
package com.myweb.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class test {
@RequestMapping("/test")
public String test(Model model){
model.addAttribute("title","这是一个标题!");
return "test";
}
}
html
html
中引入thymeleaf
,使用标签显示title,th:text="${ }"
这格式都固定的,把上面那些基础格式背熟就行了,很简单的,并不难,就那么几个标签用的多。
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Titletitle>
head>
<body>
<h1 th:text="${title}">h1>
body>
html>
Thymeleaf是一款前端插件,可以完全替代JSP,通常是Thymeleaf+HTML进行前端的开发,需要导入依赖,以及在HTML标签内加入引用。拥有很多方便的标签方法。常用来显示、判断、循环、链接、会话等操作。