SpringBoot詳細(xì)講解視圖整合引擎thymeleaf
1. 支持的視圖技術(shù)
前端模板引擎技術(shù)的出現(xiàn)，使前端開發(fā)人員無(wú)需關(guān)注后端業(yè)務(wù)的具體實(shí)現(xiàn)，只關(guān)注自己頁(yè)面的呈現(xiàn)效果即可，并且解決了前端代碼錯(cuò)綜復(fù)雜的問題、實(shí)現(xiàn)了前后端分離開發(fā)。Spring Boot框架對(duì)很多常用的
模板引擎技術(shù)（如：FreeMarker、Thymeleaf、Mustache等）提供了整合支持
Spring Boot不太支持常用的JSP模板，并且沒有提供對(duì)應(yīng)的整合配置，這是因?yàn)槭褂们度胧絊ervlet容器的Spring Boot應(yīng)用程序?qū)τ贘SP模板存在一些限制 ：
- 在Jetty和Tomcat容器中，Spring Boot應(yīng)用被打包成war文件可以支持JSP。但Spring Boot默認(rèn)使用嵌入式Servlet容器以JAR包方式進(jìn)行項(xiàng)目打包部署，這種JAR包方式不支持JSP。
- 如果使用Undertow嵌入式容器部署Spring Boot項(xiàng)目，也不支持JSP模板。（Undertow 是紅帽公司開發(fā)的一款基于 NIO 的高性能 Web 嵌入式服務(wù)器）
- Spring Boot默認(rèn)提供了一個(gè)處理請(qǐng)求路徑“/error”的統(tǒng)一錯(cuò)誤處理器，返回具體的異常信息。使用JSP模板時(shí)，無(wú)法對(duì)默認(rèn)的錯(cuò)誤處理器進(jìn)行覆蓋，只能根據(jù)Spring Boot要求在指定位置定制錯(cuò)誤頁(yè)面。
上面對(duì)Spring Boot支持的模板引擎進(jìn)行了介紹，并指出了整合JSP模板的一些限制。接下來(lái)，對(duì)其中常用的Thymeleaf模板引擎進(jìn)行介紹，并完成與Spring Boot框架的整合實(shí)現(xiàn)
2. Thymeleaf
Thymeleaf是一種現(xiàn)代的基于服務(wù)器端的Java模板引擎技術(shù)，也是一個(gè)優(yōu)秀的面向Java的XML、XHTML、HTML5頁(yè)面模板，它具有豐富的標(biāo)簽語(yǔ)言、函數(shù)和表達(dá)式，在使用Spring Boot框架進(jìn)行頁(yè)面設(shè)計(jì)時(shí)，一般會(huì)選擇Thymeleaf模板
2.1 Thymeleaf語(yǔ)法
常用標(biāo)簽
在HTML頁(yè)面上使用Thymeleaf標(biāo)簽，Thymeleaf 標(biāo)簽?zāi)軌騽?dòng)態(tài)地替換掉靜態(tài)內(nèi)容，使頁(yè)面動(dòng)態(tài)展示。為了大家更直觀的認(rèn)識(shí)Thymeleaf，下面展示一個(gè)在HTML文件中嵌入了Thymeleaf的頁(yè)面文件，示例代
碼如下：
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" media="all"
href="../../css/gtvg.css" rel="external nofollow" th:href="@{/css/gtvg.css}" rel="external nofollow" />
<title>Title</title>
</head>
<body>
<p th:text="${hello}">歡迎進(jìn)入Thymeleaf的學(xué)習(xí)</p>
</body>
</html>
上述代碼中，“xmlns:th=“http://www.thymeleaf.org”“ 用于引入Thymeleaf模板引擎標(biāo)簽，使用關(guān)鍵字“th”標(biāo)注標(biāo)簽是Thymeleaf模板提供的標(biāo)簽，其中，“th:href”用于引入外聯(lián)樣式文件，“th:text”用于動(dòng)態(tài)顯示標(biāo)簽文本內(nèi)容。
除此之外，Thymeleaf模板提供了很多標(biāo)簽，接下來(lái)，通過(guò)一張表羅列Thymeleaf的常用標(biāo)簽
2.2 標(biāo)準(zhǔn)表達(dá)式
Thymeleaf模板引擎提供了多種標(biāo)準(zhǔn)表達(dá)式語(yǔ)法，在正式學(xué)習(xí)之前，先通過(guò)一張表來(lái)展示其主要語(yǔ)法及說(shuō)明
1. 變量表達(dá)式 ${…}
變量表達(dá)式${…}主要用于獲取上下文中的變量值，示例代碼如下：
<p th:text="${title}">這是標(biāo)題</p>
示例使用了Thymeleaf模板的變量表達(dá)式${…}用來(lái)動(dòng)態(tài)獲取P標(biāo)簽中的內(nèi)容，如果當(dāng)前程序沒有啟動(dòng)或者當(dāng)前上下文中不存在title變量，該片段會(huì)顯示標(biāo)簽?zāi)J(rèn)值“這是標(biāo)題”；如果當(dāng)前上下文中存在title變量
并且程序已經(jīng)啟動(dòng)，當(dāng)前P標(biāo)簽中的默認(rèn)文本內(nèi)容將會(huì)被title變量的值所替換，從而達(dá)到模板引擎頁(yè)面數(shù)據(jù)動(dòng)態(tài)替換的效果
同時(shí)，Thymeleaf為變量所在域提供了一些內(nèi)置對(duì)象，具體如下所示
# ctx：上下文對(duì)象
# vars：上下文變量
# locale：上下文區(qū)域設(shè)置
# request：（僅限Web Context）HttpServletRequest對(duì)象
# response：（僅限Web Context）HttpServletResponse對(duì)象
# session：（僅限Web Context）HttpSession對(duì)象
# servletContext：（僅限Web Context）ServletContext對(duì)象
結(jié)合上述內(nèi)置對(duì)象的說(shuō)明，假設(shè)要在Thymeleaf模板引擎頁(yè)面中動(dòng)態(tài)獲取當(dāng)前國(guó)家信息，可以使用#locale內(nèi)置對(duì)象，示例代碼如下
The locale country is: <span th:text="${#locale.country}">US</span>.
上述代碼中，使用th:text="${#locale.country}"動(dòng)態(tài)獲取當(dāng)前用戶所在國(guó)家信息，其中標(biāo)簽內(nèi)默認(rèn)內(nèi)容為US（美國(guó)），程序啟動(dòng)后通過(guò)瀏覽器查看當(dāng)前頁(yè)面時(shí)，Thymeleaf會(huì)通過(guò)瀏覽器語(yǔ)言設(shè)置來(lái)識(shí)別當(dāng)前用戶所在國(guó)家信息，從而實(shí)現(xiàn)動(dòng)態(tài)替換
2. 選擇變量表達(dá)式 *{…}
選擇變量表達(dá)式和變量表達(dá)式用法類似，一般用于從被選定對(duì)象而不是上下文中獲取屬性值，如果沒有選定對(duì)象，則和變量表達(dá)式一樣，示例代碼如下
<div th:object="${book}">
<p>titile: <span th:text="*{title}">標(biāo)題</span>.</p>
</div
*{title} 選擇變量表達(dá)式獲取當(dāng)前指定對(duì)象book的title屬性值。
3. 消息表達(dá)式 #{…}
消息表達(dá)式#{…}主要用于Thymeleaf模板頁(yè)面國(guó)際化內(nèi)容的動(dòng)態(tài)替換和展示，使用消息表達(dá)式#{…}進(jìn)行國(guó)際化設(shè)置時(shí)，還需要提供一些國(guó)際化配置文件。
4. 鏈接表達(dá)式 @{…}
鏈接表達(dá)式@{…}一般用于頁(yè)面跳轉(zhuǎn)或者資源的引入，在Web開發(fā)中占據(jù)著非常重要的地位，并且使用也非常頻繁，示例代碼如下：
<a th:href="@{http://localhost:8080/order/details(orderId=${o.id})}" rel="external nofollow" >view</a>
<a th:href="@{/order/details(orderId=${o.id},pid=${p.id})}" rel="external nofollow" >view</a>
上述代碼中，鏈接表達(dá)式@{…}分別編寫了絕對(duì)鏈接地址和相對(duì)鏈接地址。在有參表達(dá)式中，需要按照@{路徑(參數(shù)名稱=參數(shù)值，參數(shù)名稱=參數(shù)值…)}的形式編寫，同時(shí)該參數(shù)的值可以使用變量表達(dá)式來(lái)傳遞動(dòng)態(tài)參數(shù)值
5. 片段表達(dá)式 ~{…}
片段表達(dá)式~{…}用來(lái)標(biāo)記一個(gè)片段模板，并根據(jù)需要移動(dòng)或傳遞給其他模板。其中，最常見的用法是使用th:insert或th:replace屬性插入片段，示例代碼如下：
<div th:insert="~{thymeleafDemo::title}"></div>上述代碼中，使用th:insert屬性將title片段模板引用到該標(biāo)簽中。thymeleafDemo為模板名稱，Thymeleaf會(huì)自動(dòng)查找 “/resources/templates/” 目錄下的thymeleafDemo模板，title為片段名稱
3. 基本使用
3.1 Thymeleaf模板基本配置
首先 在Spring Boot項(xiàng)目中使用Thymeleaf模板，首先必須保證引入Thymeleaf依賴，示例代碼如下：
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
其次，在全局配置文件中配置Thymeleaf模板的一些參數(shù)。一般Web項(xiàng)目都會(huì)使用下列配置，示例代碼如：
spring.thymeleaf.cache = true ＃啟用模板緩存
spring.thymeleaf.encoding = UTF_8 ＃模板編碼
spring.thymeleaf.mode = HTML5 ＃應(yīng)用于模板的模板模式
spring.thymeleaf.prefix = classpath:/templates/ ＃指定模板頁(yè)面存放路徑
spring.thymeleaf.suffix = .html ＃指定模板頁(yè)面名稱的后綴
上述配置中，spring.thymeleaf.cache表示是否開啟Thymeleaf模板緩存，默認(rèn)為true，在開發(fā)過(guò)程中通常會(huì)關(guān)閉緩存，保證項(xiàng)目調(diào)試過(guò)程中數(shù)據(jù)能夠及時(shí)響應(yīng)；spring.thymeleaf.prefix指定了Thymeleaf模板頁(yè)面的存放路徑，默認(rèn)為classpath:/templates/；spring.thymeleaf.suffix指定了Thymeleaf模板頁(yè)面的名稱后綴，默認(rèn)為.html
3.2 靜態(tài)資源的訪問
開發(fā)Web應(yīng)用時(shí)，難免需要使用靜態(tài)資源。Spring boot默認(rèn)設(shè)置了靜態(tài)資源的訪問路徑。
使用Spring Initializr方式創(chuàng)建的Spring Boot項(xiàng)目，默認(rèn)生成了一個(gè)resources目錄，在resources目錄中新建public、resources、static三個(gè)子目錄下，Spring boot默認(rèn)會(huì)挨個(gè)從public、resources、static里面查找靜態(tài)資源
3.3 完成數(shù)據(jù)的頁(yè)面展示
1. 創(chuàng)建Spring Boot項(xiàng)目
引入Thymeleaf依賴
2. 編寫配置文件
打開application.properties全局配置文件，在該文件中對(duì)Thymeleaf模板頁(yè)面的數(shù)據(jù)緩存進(jìn)行設(shè)置
# thymeleaf頁(yè)面緩存設(shè)置（默認(rèn)為true），開發(fā)中方便調(diào)試應(yīng)設(shè)置為false，上線穩(wěn)定后應(yīng)保持默認(rèn)
true
spring.thymeleaf.cache=false
使用“spring.thymeleaf.cache=false”將Thymeleaf默認(rèn)開啟的緩存設(shè)置為了false，用來(lái)關(guān)閉模板頁(yè)面緩存
3. 創(chuàng)建web控制類
在項(xiàng)目中創(chuàng)建名為com.lagou.controller的包，并在該包下創(chuàng)建一個(gè)用于前端模板頁(yè)面動(dòng)態(tài)數(shù)據(jù)替換效果測(cè)試的訪問實(shí)體類LoginController
@Controller
public class LoginController {
/**
* 獲取并封裝當(dāng)前年份跳轉(zhuǎn)到登錄頁(yè)login.html
*/
@RequestMapping("/toLoginPage")
public String toLoginPage(Model model){
model.addAttribute("currentYear",
Calendar.getInstance().get(Calendar.YEAR));
return "login";
}
toLoginPage()方法用于向登錄頁(yè)面login.html跳轉(zhuǎn)，同時(shí)攜帶了當(dāng)前年份信息currentYear。
4. 創(chuàng)建模板頁(yè)面并引入靜態(tài)資源文件
在“classpath:/templates/”目錄下引入一個(gè)用戶登錄的模板頁(yè)面login.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1,shrink-
to-fit=no">
<title>用戶登錄界面</title>
<link th:href="@{/login/css/bootstrap.min.css}" rel="external nofollow" rel="stylesheet">
<link th:href="@{/login/css/signin.css}" rel="external nofollow" rel="stylesheet">
</head>
<body class="text-center">
<!-- 用戶登錄form表單 -->
<form class="form-signin">
<img class="mb-4" th:src="@{/login/img/login.jpg}" width="72" height="72">
<h1 class="h3 mb-3 font-weight-normal">請(qǐng)登錄</h1>
<input type="text" class="form-control"
th:placeholder="用戶名" required="" autofocus="">
<input type="password" class="form-control"
th:placeholder="密碼" required="">
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="remember-me"> 記住我
</label>
</div>
<button class="btn btn-lg btn-primary btn-block" type="submit" >登錄</button>
<p class="mt-5 mb-3 text-muted">? <span
th:text="${currentYear}">2019</span>-<span
th:text="${currentYear}+1">2020</span></p>
</form>
</body>
</html>
通過(guò)“xmlns:th=“http://www.thymeleaf.org””引入了Thymeleaf模板標(biāo)簽；
使用“th:href”和“th:src”分別引入了兩個(gè)外聯(lián)的樣式文件和一個(gè)圖片；
使用“th:text”引入了后臺(tái)動(dòng)態(tài)傳遞過(guò)來(lái)的當(dāng)前年份currentYear
5．效果測(cè)試
到此這篇關(guān)于SpringBoot詳細(xì)講解視圖整合引擎thymeleaf的文章就介紹到這了,更多相關(guān)SpringBoot thymeleaf內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了Java Map.Entry的使用方法解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-03-03
Struts2數(shù)據(jù)輸入驗(yàn)證教程詳解
這篇文章主要介紹了Struts2數(shù)據(jù)輸入驗(yàn)證教程詳解的相關(guān)資料,輸入數(shù)據(jù)驗(yàn)證的方法有兩種，本文給大家介紹的非常詳細(xì)，需要的朋友可以參考下2016-10-10
這篇文章主要大家介紹了關(guān)于如何在Java中優(yōu)雅地判空的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-11-11
淺談Java繼承中的轉(zhuǎn)型及其內(nèi)存分配
這篇文章主要介紹了淺談Java繼承中的轉(zhuǎn)型及其內(nèi)存分配，首先分享了簡(jiǎn)單的代碼及運(yùn)行結(jié)果，然后對(duì)其進(jìn)行分析，繼而引出了2017-11-11
這篇文章主要介紹了idea使用Mybatis逆向工程插件詳情，首先使用mybatis連接數(shù)據(jù)庫(kù)接著添加連接的mysql的信息，測(cè)試鏈接等過(guò)程，更多過(guò)程了解請(qǐng)參考下面文章的詳細(xì)內(nèi)容2022-01-01
Java使用XML與注解方式實(shí)現(xiàn)CRUD操作代碼
MyBatis提供了靈活的配置和使用方式,使得數(shù)據(jù)庫(kù)操作更加簡(jiǎn)潔和高效,通過(guò)本文,我們介紹了如何使用MyBatis框架,通過(guò)XML映射文件和注解兩種方式來(lái)實(shí)現(xiàn)數(shù)據(jù)庫(kù)的增刪改查操作,感興趣的朋友跟隨小編一起看看吧2024-02-02
java+sqlserver實(shí)現(xiàn)學(xué)生信息管理系統(tǒng)
這篇文章主要介紹了利用java和sqlserver實(shí)現(xiàn)學(xué)生信息管理系統(tǒng)，違章內(nèi)容主要建立了與sqlserver數(shù)據(jù)庫(kù)的連接開始展開內(nèi)容，能學(xué)到了解JDBC執(zhí)行SQL的語(yǔ)法,需要的朋友可以參考一下2021-12-12
Java微信掃碼登錄功能并實(shí)現(xiàn)認(rèn)證授權(quán)全過(guò)程
這篇文章主要給大家介紹了關(guān)于Java微信掃碼登錄功能并實(shí)現(xiàn)認(rèn)證授權(quán)的相關(guān)資料,要在Java中實(shí)現(xiàn)微信掃碼登錄,您可以按照以下步驟進(jìn)行操作,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-10-10
Java實(shí)現(xiàn)在Word指定位置插入分頁(yè)符
在Word插入分頁(yè)符可以在指定段落后插入，也可以在特定文本位置處插入。本文將以Java代碼來(lái)操作以上兩種文檔分頁(yè)需求,需要的可以參考一下2022-04-04
Java并行執(zhí)行任務(wù)的幾種方案小結(jié)
這篇文章主要介紹了Java并行執(zhí)行任務(wù)的幾種方案小結(jié)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2021-11-11