一、源碼地址
https://github.com/dianjiu/spring-boot-learn
https://gitee.com/dianjiu/spring-boot-learn
https://gitee.com/point9/spring-boot-learn
二、目錄結構
![]()
三、代碼分析
1、引入依賴
<!--thymeleaf-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
2、三種配置方式
2.1 properties方式
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.mode=HTML
2.2 yml方式
spring:
thymeleaf:
cache: false # 關閉頁面緩存
encoding: UTF-8 # 模板編碼
prefix: classpath:/templates/ # 頁面映射路徑
suffix: .html # 試圖後的後綴
mode: LEGACYHTML5 # 模板模式
2.3 Java方式
package cn.point9.thymeleaf.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.ViewResolver;
import org.thymeleaf.spring5.SpringTemplateEngine;
import org.thymeleaf.spring5.templateresolver.SpringResourceTemplateResolver;
import org.thymeleaf.spring5.view.ThymeleafViewResolver;
import org.thymeleaf.templatemode.TemplateMode;
import org.thymeleaf.templateresolver.ITemplateResolver;
/**
* 1、ThymeleafViewResolver 接收邏輯視圖名稱將它解析爲視圖
* 2、SpringTemplateEngine會在Spring中啓用Thymeleaf引擎，用來解析模板，並基於這些模板渲染結果
* 3、TemplateResolver會最終定位和查找模板。
*/
@Configuration
public class WebConfig {
/**
* 配置 Thymeleaf 視圖解析器 —— 將邏輯視圖名稱解析爲 Thymeleaf 模板視圖
*
* @param springTemplateEngine 模板引擎
* @return
*/
@Bean
public ViewResolver viewResolver(SpringTemplateEngine springTemplateEngine){
ThymeleafViewResolver resolver = new ThymeleafViewResolver();
resolver.setTemplateEngine(springTemplateEngine);
return resolver;
}
/**
* 模板引擎 —— 處理模板並渲染結果
*
* @param templateResolver 模板解析器
* @return
*/
@Bean
public SpringTemplateEngine springTemplateEngine(ITemplateResolver templateResolver) {
SpringTemplateEngine springTemplateEngine = new SpringTemplateEngine();
springTemplateEngine.setTemplateResolver(templateResolver);
return springTemplateEngine;
}
/**
* 模板解析器 —— 加載 Thymeleaf 模板
*
* @return
*/
@Bean
public ITemplateResolver templateResolver() {
SpringResourceTemplateResolver templateResolver = new SpringResourceTemplateResolver();
templateResolver.setPrefix("classpath:/templates/");
templateResolver.setSuffix(".html");
templateResolver.setTemplateMode(TemplateMode.HTML);
templateResolver.setCacheable(false);
templateResolver.setTemplateMode("LEGACYHTML5");
return templateResolver;
}
}
3、兩種引入靜態資源的方式
3.1、@{}方式
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Thymeleaf入門案例</title>
<link rel="stylesheet" type="text/css" th:href="@{css/style.css}"/>
<!--<link rel="stylesheet" type="text/css" href="css/style.css"/>-->
<script th:src="@{js/test.js}"></script>
<!--<script src="js/test.js"></script>-->
</head>
<body>
<h1>Thymeleaf入門案例:</h1>
<span th:text="hello"></span>
<hr>
<span th:text="${msg}"></span>
</body>
</html>
3.2 Java方式
package cn.point9.thymeleaf.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
/**
* 添加靜態資源文件，外部可以直接訪問地址
* @param registry
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
//需要配置1：----------- 需要告知系統，這是要被當成靜態文件的！
//第一個方法設置訪問路徑前綴，第二個方法設置資源路徑
registry.addResourceHandler("/static/**").addResourceLocations("classpath://");
registry.addResourceHandler("/templates/**").addResourceLocations("classpath:/templates/");
}
}
四、項目演示
五、技術交流
