《深入實踐Spring Boot》一3.3 使用Thymeleaf模闆

####本節書摘來自華章出版社《深入實踐spring boot》一書中的第3章，第3.3節，作者陳韶健，更多章節内容可以通路雲栖社群“華章計算機”公衆号檢視。

完成了模型和控制器的設計之後，接下來的工作就是視圖設計了。在視圖設計中主要使用thymeleaf模闆來實作。在進行視圖設計之前，先了解一下thymeleaf模闆的功能。

thymeleaf是一個優秀的面向java的xml/xhtml/html 5頁面模闆，并具有豐富的标簽語言和函數。使用spring boot架構進行界面設計，一般都會選擇thymeleaf模闆。

要使用thymeleaf模闆，首先，必須在工程的maven管理中引入它的依賴：“spring-boot-starter-thymeleaf”，如代碼清單3-9所示。

代碼清單3-9　thymeleaf依賴配置

其次，必須配置使用thymeleaf模闆的一些參數。在一般的web項目中都會使用如代碼清單3-10所示的配置，其中，pref?ix指定了html檔案存放在webapp的/web-inf/views/目錄下面，或者也可以指定其他路徑，其他一些參數的設定其實是使用了thymeleaf的預設設定。

在執行個體中，為了更友善将項目釋出成jar檔案，我們将使用thymeleaf自動配置中的預設配置選項，即隻要在資源檔案夾resoueces中增加一個templates目錄即可，這個目錄用來存放html檔案。

代碼清單3-10　thymeleaf配置

如果工程中增加了thymeleaf的依賴，而沒有進行任何配置，或者增加預設目錄，啟動應用時就會報錯。

在html頁面上使用thymeleaf标簽語言，用一個簡單的關鍵字“th”來标注。使用thymeleaf标簽語言的典型例子如下：

其中，th:text指定了在标簽<中顯示的文本，它的值來自于關鍵字“$”所引用的記憶體變量，th:src設定了标簽的圖檔檔案的連結位址，既可以是絕對路徑，也可以是相對路徑。下面列出了thymeleaf的一些主要标簽和函數。

th:text，顯示文本。

th:utext：和th:text的差別是針對"unescaped text"。

th:attr：設定标簽屬性。

th:if or th:unless：條件判斷語句。

th:switch，th:case：選擇語句。

th:each：循環語句。

1.使用功能函數

thymeleaf有一些日期功能函數、字元串函數、數組函數、清單函數等，代碼清單3-11是thymeleaf使用日期函數的一個例子，#dates.format是一個日期格式化的使用執行個體，它将電影的建立日期格式化為中文環境的使用格式“'yyyy-mm-dd hh:mm:ss'”。

代碼清單3-11　thymeleaf使用函數

2.使用程式設計語句

thymeleaf有條件語句、選擇語句、循環語句等。代碼清單3-12使用each循環語句來顯示一個資料清單，即在下拉清單框中使用循環語句來顯示所有的演員清單。

代碼清單3-12　th:each循環

3.使用頁面架構模闆

thymeleaf的頁面架構模闆是比較優秀的功能。預先定義一個layout，它具有頁眉、頁腳、提示欄、導航欄和内容顯示等區域，如代碼清單3-13所示。其中，layout:fragment=

" prompt"是一個提示欄，它可以讓引用的視圖替換顯示的内容；fragments/nav :: nav是一個導航欄并指定了視圖檔案，也就是說它不能被引用的視圖替換内容；layout:fragment="content"是一個主要内容顯示區域，它也能由引用的視圖替換顯示内容；fragments/footer :: footer是一個頁腳定義并且也指定了視圖檔案，即不被引用的視圖替換顯示内容。這樣設計出來的頁面模闆架構如圖3-1所示。

代碼清單3-13　layout模闆

有了頁面模闆之後，就可以在一個首頁面視圖上引用上面的layout，并替換它的提示欄prompt和主要内容顯示區域content，其他頁眉、頁腳和導航欄卻保持同樣的内容，如代碼清單3-14所示。這樣就可以設計出一個使用共用模闆的具有統一風格特征的界面。

代碼清單3-14　使用layout模闆的視圖設計

xmlns:th="http://www.thymeleaf.org" layout:decorator="fragments/layout">

目前位置：首頁 > 電影管理