SpringBoot-04-之模板引擎--thymeleaf

mac2022-06-30  131

一.前期工作

1.添加依赖
<!--thymeleaf引擎模板--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
2.thymeleaf 静态资源配置:src\main\resources\application-dev.yml
#默认 spring.thymeleaf.prefix=classpath:/templates/ #默认 spring.thymeleaf.suffix=.html #默认 spring.thymeleaf.mode=HTML5 #默认 spring.thymeleaf.encoding=UTF-8 #默认 spring.thymeleaf.servlet.content-type=text/html #关闭缓存,即使刷新(上线时改为true) spring.thymeleaf.cache=false

二.使用

1.显示静态页面
新建html:src\main\resources\templates\index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HelloThymeleaf</title> </head> <body> <h1>thymeleaf in spring boot</h1> </body> </html> 控制器:toly1994.com.toly01.controller.ThymeleafController /** * 作者:张风捷特烈 * 时间:2018/7/16:16:08 * 邮箱:1981462002@qq.com * 说明:Thymeleaf模板引擎控制器 */ @Controller //注意由于是RequestBody 所以这里将@RestController拆分出来了 public class ThymeleafController { @GetMapping("/HelloThymeleaf") public String say() { return "index"; } } 访问:http://localhost:8080/HelloThymeleaf thymeleaf.png
2.使用css
配置:src\main\resources\application-dev.yml mvc: static-path-pattern: /static/** #启用静态文件夹 创建css文件:src\main\resources\static\css\my.css h1{ color: #00f; } 引用:src\main\resources\templates\index.html <link rel="stylesheet" href="../static/css/my.css"> 访问:http://localhost:8080/HelloThymeleaf css使用.png
3.使用js
创建js文件:src\main\resources\static\js\my.js alert("hello toly!") 引用:src\main\resources\templates\index.html <script src="../static/js/my.js"></script> 访问:http://localhost:8080/HelloThymeleaf js使用.png
4.动态替换静态页面数据
使用:src\main\resources\templates\index.html <body> <h1 th:text="${replace_text}">thymeleaf in spring boot</h1> </body> 控制器:toly1994.com.toly01.controller.ThymeleafController @GetMapping("/useData") public String useData(ModelMap map) { map.addAttribute("replace_text", "张风捷特烈"); return "index"; } 访问:http://localhost:8080/useData 动态修改.png

转载于:https://www.cnblogs.com/toly-top/p/9782001.html

最新回复(0)