Spring Boot 中可以支持很多模板引擎，Thymeleaf 是 Spring Boot 官方推薦使用的模板引擎，雖然在社區 Thymeleaf 的性能被許多人所吐糟，但這仍然不影響大量的開發人員使用他。
Thymeleaf 是后台開發的最佳實踐
當前 Spring Boot 2.0 及以后版本已經支持 Thymeleaf 3.0。
本章講解如何在 Spring Boot 中使用 Themealf.
歡迎關注我的微信公眾號 程序魚 ,我們一起編程聊天看世界。
1 創建一個 Spring Boot 工程
1）File > New > Project，如下圖選擇 Spring Initializr 然后點擊 【Next】下一步
2）填寫 GroupId（包名）、Artifact（項目名） 即可。點擊 下一步
groupId=com.fishpro
artifactId=thymeleaf
3)選擇依賴 Spring Web Starter 前面打鈎，選擇模板，在 Thymeleaf 依賴前面打鈎
4)項目名設置為 ·spring-boot-study-thymeleaf。
2 引入依賴
如果在創建項目的時候已經引入依賴，則不需要此步驟，打開根目錄下的文件 pom.xml dependencies 節點加入以下代碼
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
3 配置Thymeleaf
找到src\main\resources\application.yml，如果是application.properties 更名后綴yml 即可,當然習慣使用 properties 后綴的則不需要更改。
注意這里的配置不是必須的，不配做，thymeleaf則有默認的配置。
server:
port: 8083
#thymelea模板配置
spring:
thymeleaf:
#thymeleaf 所在路徑
prefix: classpath:/templates/
#thymeleaf 后綴
suffix: .html
#thymeleaf 采用的標准
mode: HTML5
#thymeleaf 編碼格式
encoding: UTF-8
application.properties 后綴格式 表示為 spring.thymeleaf.prefix=classpath:/templates/ 其他類似修改。
4 編寫代碼實例
4.1 項目結構
在編寫代碼之前應該搞清楚 thymeleaf 結構。
src\main\resources\templates 為目錄的 thymeleaf 模板存放路徑
4.2 數據准備
- 新建Java文件 src\main...\controller\IndexController.java
在 IndexController 增加展示層數據的輸出
UserDTO.java 用於測試的實體類
public class UserDTO {
private String username;
private String sex;
private Date birthday;
public UserDTO(){}
public UserDTO(String username,String sex,Date birthday){
this.username=username;
this.sex=sex;
this.birthday=birthday;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public Date getBirthday() {
return birthday;
}
public void setBirthday(Date birthday) {
this.birthday = birthday;
}
}
IndexController.java 用於測試的控制層
@Controller
public class IndexController {
@RequestMapping("/sample")
public String sample(Model model){
model.addAttribute("user",getUserDTOData());
List<UserDTO> users=new ArrayList<>();
users.add(new UserDTO("zhangsan","男",new Date()));
users.add(new UserDTO("wangjingjing","女",new Date()));
users.add(new UserDTO("limeimei","女",new Date()));
users.add(new UserDTO("lisi","男",new Date()));
model.addAttribute("users",users);
return "/index/sample";
}
/**
* 構造一個user對象
* */
private UserDTO getUserDTOData(){
UserDTO userDTO=new UserDTO();
userDTO.setUsername("fishpro");
userDTO.setSex("男");
userDTO.setBirthday(new Date());
return userDTO;
}
}
- 新建模板文件src\main\resources\templates\index\sample.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Thymeleaf簡單示例</title>
</head>
<body>
<p style="background-color: #c7ddef">
${...} 可以顯示后台傳輸的變量
</p>
<p th:text="${user.username}"></p>
<p style="background-color: #c7ddef">
th:each循環標簽
</p>
<p th:each=" userobject : ${users}">
<span th:text="${userobject.username}"></span>
</p>
</body>
</html>
5 運行實例
在瀏覽器中輸入 http://localhost:8083/demo/simple
歡迎關注我的微信公眾號,我們一起編程聊天看世界