本項目的筆記和資料的Download，請點擊這一句話自行獲取。
day01-springboot（理論篇） ；day01-springboot（實踐篇） ；day01-springboot（Thymeleaf快速入門）
5.Thymeleaf快速入門
SpringBoot不推薦使用jsp，但是支持一些模板引擎技術：
5.1.為什么是Thymeleaf？
簡單說， Thymeleaf 是一個模板引擎，它可以完全替代 JSP 。相較於其他的模板引擎，它有如下四個極吸引人的特點：
- 動靜結合：Thymeleaf 在有網絡和無網絡的環境下皆可運行，即它可以讓美工在瀏覽器查看頁面的靜態效果，也可以讓程序員在服務器查看帶數據的動態頁面效果。這是由於它支持 html 原型，然后在 html 標簽里增加額外的屬性來達到模板+數據的展示方式。瀏覽器解釋 html 時會忽略未定義的標簽屬性，所以 thymeleaf 的模板可以靜態地運行；當有數據返回到頁面時，Thymeleaf 標簽會動態地替換掉靜態內容，使頁面動態顯示。
- 開箱即用：它提供標准和spring標准兩種方言，可以直接套用模板實現JSTL、 OGNL表達式效果，避免每天套模板、改jstl、改標簽的困擾。同時開發人員也可以擴展和創建自定義的方言。
- 多方言支持：Thymeleaf 提供spring標准方言和一個與 SpringMVC 完美集成的可選模塊，可以快速的實現表單綁定、屬性編輯器、國際化等功能。
- 與SpringBoot完美整合，SpringBoot提供了Thymeleaf的默認配置，並且為Thymeleaf設置了視圖解析器，我們可以像以前操作jsp一樣來操作Thymeleaf。代碼幾乎沒有任何區別，就是在模板語法上有區別。
接下來，我們就通過入門案例來體會Thymeleaf的魅力：
5.2.提供數據
編寫一個controller方法，返回一些用戶數據，放入模型中，將來在頁面渲染
@GetMapping("/all")
public String all(ModelMap model) {
// 查詢用戶
List<User> users = this.userService.queryAll();
// 放入模型
model.addAttribute("users", users);
// 返回模板名稱（就是classpath:/templates/目錄下的html文件名）
return "users";
}
5.3.引入啟動器
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
SpringBoot會自動為Thymeleaf注冊一個視圖解析器：
與解析JSP的InternalViewResolver類似，Thymeleaf也會根據前綴和后綴來確定模板文件的位置：
- 默認前綴：
classpath:/templates/ - 默認后綴：
.html
所以如果我們返回視圖：users，會指向到 classpath:/templates/users.html
一般我們無需進行修改，默認即可。
5.4.靜態頁面
根據上面的介紹，模板默認放在classpath下的templates文件夾，我們新建一個html文件放入其中：
編寫html模板，渲染模型中的數據：
注意，把html 的名稱空間，改成：xmlns:th="http://www.thymeleaf.org" 會有語法提示。
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org">
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>首頁</title> <style type="text/css"> table {border-collapse: collapse; font-size: 14px; width: 80%; margin: auto} table, th, td {border: 1px solid darkslategray;padding: 10px} </style> </head> <body> <div style="text-align: center"> <span style="color: darkslategray; font-size: 30px">歡迎光臨！</span> <hr/> <table class="list"> <tr> <th>id</th> <th>姓名</th> <th>用戶名</th> <th>年齡</th> <th>性別</th> <th>生日</th> </tr> <tr th:each="user : ${users}"> <td th:text="${user.id}">1</td> <td th:text="${user.name}">張三</td> <td th:text="${user.userName}">zhangsan</td> <td th:text="${user.age}">20</td> <td th:text="${user.sex}">男</td> <td th:text="${user.birthday}">1980-02-30</td> </tr> </table> </div> </body> </html>
我們看到這里使用了以下語法：
${}：這個類似與el表達式，但其實是ognl的語法，比el表達式更加強大th-指令：th-是利用了Html5中的自定義屬性來實現的。如果不支持H5，可以用data-th-來代替th:each：類似於c:foreach遍歷集合，但是語法更加簡潔th:text：聲明標簽中的文本- 例如
<td th-text='${user.id}'>1</td>，如果user.id有值，會覆蓋默認的1 - 如果沒有值，則會顯示td中默認的1。這正是thymeleaf能夠動靜結合的原因，模板解析失敗不影響頁面的顯示效果，因為會顯示默認值。
- 例如
5.5.測試
接下來，我們打開頁面測試一下：
5.6.模板緩存
Thymeleaf會在第一次對模板解析之后進行緩存，極大的提高了並發處理能力。但是這給我們開發帶來了不便，修改頁面后並不會立刻看到效果，我們開發階段可以關掉緩存使用：
# 開發階段關閉thymeleaf的模板緩存
spring.thymeleaf.cache=false
在Idea中，我們需要在修改頁面后按快捷鍵：`Ctrl + Shift + F9` 對項目進行rebuild才可以。
============================
參考資料：
end