SpringBoot - 整合 Thymeleaf 模板引擎
阿新 • • 發佈：2020-12-27
技術標籤：SpringBootSpringBootThymeleaf模板引擎
一、基本介紹
1、什麼是Thymeleaf
- Thymeleaf是新一代Java模板引擎，類似於Velocity、FreeMarker等傳統Java模板引擎。
- Thymeleaf 在有網路和無網路的環境下皆可執行，即它可以讓美工在瀏覽器檢視頁面的靜態效果，也可以讓程式設計師在伺服器檢視帶資料的動態頁面效果。這是由於它支援 html 原型，然後在 html 標籤裡增加額外的屬性來達到模板+資料的展示方式。瀏覽器解釋 html 時會忽略未定義的標籤屬性，所以 thymeleaf 的模板可以靜態地執行；當有資料返回到頁面時，Thymeleaf 標籤會動態地替換掉靜態內容，使頁面動態顯示。
- Thymeleaf 開箱即用的特性。它提供標準和spring標準兩種方言，可以直接套用模板實現JSTL、 OGNL表示式效果，避免每天套模板、該jstl、改標籤的困擾。同時開發人員也可以擴充套件和建立自定義的方言
- Thymeleaf也是Spring Boot官方推薦使用的模版引擎。同時Spring Boot也為Thymeleaf提供了完整的自動化配置解決方案。
2、基本語法
（1）常用表示式
- ${...}：獲取變數值。
- *{...}：選擇變量表達式。
- #{...}：訊息文字表達式。
- @{...}：連結表示式。
- #maps：工具物件表示式。
（2）常用標籤
- th:action：定義後臺控制器路徑。
- th:each：迴圈語句。
- th:field：表單欄位繫結。
- th:id：div標籤中的ID宣告，類似HTML標籤中的歸屬性。
- th:if：條件判斷語句。
- th:href：定義超連結。
- th:include：佈局標籤，替換內容到引入檔案。
- th:src：圖片類地址引入。
- th:text：顯示文字。
- th:fragment：佈局標籤，定義一個程式碼片段，方便其他地方引用。
- th:object：替換物件。
- th:value：屬性賦值。
（3）常用函式
- #dates：日期函式。
- #lists：列表函式。
- #arrays：陣列函式。
- #objects：物件函式。
- #bools：邏輯函式
- #strings：字串函式。
- #numbers：數字函式。
- #calendars：日曆函式。
3、新增依賴及配置
(1)、在SpringBoot 專案的 pom.xml 檔案中新增 spring-boot-starter-web和 spring-boot-starter-thymeleaf 依賴
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>(2)、Spring Boot為Thymeleaf提供了預設的配置，如果想更改預設配置只需在 application.properties 中新增配置即可，下面是一些常見的配置：
#是否開啟快取，開發時可以設定為 false，預設為 true
spring.thymeleaf.cache=true
#檢查模版是否存在，預設為 true
spring.thymeleaf.check-template=true
#檢查模版位置是否存在，預設為 true
spring.thymeleaf.check-template-location=true
#模版檔案編碼
spring.thymeleaf.encoding=UTF-8
#模版檔案位置
spring.thymeleaf.prefix=classpath:/templates/
#Content-Type配置
spring.thymeleaf.servlet.content-type=text/html
#模版檔案字尾
spring.thymeleaf.suffix=.htmlSpring Boot為Thymeleaf提供的預設的相關的配置屬性在ThymeleafProperties類中
二、例項展示
1、編寫控制類
(2)、首先建立一個實體類
public class Book {
private String name;
private String author;
private Double price;
public Book(String name, String author, Double price) {
this.name = name;
this.author = author;
this.price = price;
}
// 省略 getter 和 setter 方法
}(2)、建立 BookController 控制類
@Controller
public class BookController {
@GetMapping("/books")
public ModelAndView boolInfo(){
//建立返回資料
List<Book> books = Arrays.asList(
new Book("金瓶梅", "蘭陵笑笑生", 100.0),
new Book("紅樓夢", "曹雪芹", 200.0),
new Book("MySQL從入門到刪庫", "佚名", 200.0));
// 建立返回的檢視物件
ModelAndView view = new ModelAndView();
view.addObject("books", books);
view.setViewName("index");
return view;
}
}
2、建立檢視
(1)、在resources目錄下的 classpath:/templates目錄中建立 index.html
<!DOCTYPE html >
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table style="border: 1px; collapse: 0;">
<tr>
<th>書名</th>
<th>作者</th>
<th>價格</th>
</tr>
<tr th:each="book:${books}">
<td th:text="${book.name}"></td>
<td th:text="${book.author}"></td>
<td th:text="${book.price}"></td>
</tr>
</table>
</body>
</html>由上文也可以知道需要在html中新增：<html xmlns:th="http://www.thymeleaf.org">這樣，下文才能正確使用th:*形式的標籤！
3、啟動專案
啟動專案後訪問 http://localhost:8080/books
