SpringBoot 整合Thymeleaf
说明:
Thymeleaf 是一个跟 Velocity、FreeMarker 类似的模板引擎,它可以完全替代 JSP 。
相较与其他的模板引擎,它有如下三个极吸引人的特点:
1. Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板 + 数据的展示方式。浏览器解释 html 时会忽略未定义的标签属性,所以 thymeleaf 的模板可以静态地运行;当有数据返回到页面时,Thymeleaf 标签会动态地替换掉静态内容,使页面动态显示。
2. Thymeleaf 开箱即用的特性。它提供标准和 Spring 标准两种方言,可以直接套用模板实现 JSTL、 OGNL 表达式效果,避免每天套模板、改 JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
3. Thymeleaf 提供 Spring 标准方言和一个与 SpringMVC 完美集成的可选模块,可以快速的实现表单绑定、属性编辑器、国际化等功能。
此篇是基于以下文章继续创作。
1.1 搭建Springboot脚手架
1.2 搭建SpringBoot脚手架注解及标签说明
1.3 SpringBoot 整合热部署
目录
模块 | 配置项 | 备注 |
---|---|---|
添加依赖 | pom.xml | 额外添加nekohtml依赖,解决thymealeaf标签闭合问题 |
配置文件 | application.properties | 配置文件不允许有多余空格 |
测试控制类 | TestController.java | 可以跳转到templates文件夹下的html页面并且传递参数 |
HTML页面 | login.html | 接收控制类传递的数据加以处理 |
项目结构
下图为Eclipse中的项目结构截图
说明:
在此之前需要构建resources文件夹
新建static和templates文件夹
静态资源存放在static文件夹下
html文件要存放在templates文件夹下
注:
新建templates和static文件夹时,要直接在resources文件夹上new Folder,否则之后controller层跳转页面会出错
1. pom.xml
注: 在dependencies标签内加入如下代码
<!--thymeleaf-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!--nekohtml 解决thymealeaf标签闭合问题-->
<dependency>
<groupId>net.sourceforge.nekohtml</groupId>
<artifactId>nekohtml</artifactId>
<version>1.9.14</version>
</dependency>
2. application.properties
注: 配置文件代码不允许有空格,否则会报错
# ====================================================================
# ===================Thymeleaf 相关设置============================
# ====================================================================
# 是否开启模板缓存,默认true,开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
# 指定模板的编码,默认为: UTF-8
spring.thymeleaf.encoding=UTF-8
#返回模板类型
spring.thymeleaf.content-type=text/html
# 指定模板的前缀(文件位置),默认为:classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/
# 指定模板的后缀,默认为:.html
spring.thymeleaf.suffix=.html
# 指定模板的模式, 默认为:HTML5 (如果使用了nekohtml依赖 设置为LEGACYHTML5,去除thymeleaf的html严格校验)
spring.thymeleaf.mode=LEGACYHTML5
#默认值为/**,与下面locations成对使用
#spring.mvc.static-path-pattern=/**
#自定义Spring boot加载前端静态资源路径
spring.resources.static-locations=classpath:/templates/,classpath:/static/
3. MainController.java
3.1 MainController1.java
注: 添加控制类测试跳转页面
package org.it.Demo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class MainController {
@RequestMapping("/index")
public String index() {
return "index";//返回到index.html页面
}
}
3.2 MainController2.java
注: 添加控制类测试返回数据
package org.it.Demo.Controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class TestController {
@RequestMapping("/")
public String index(ModelMap map) {
//单个数据
map.put("hello", "这是显示欢迎信息");
return "3";
}
}
4. 3.html
注:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--使用Thymeleaf标签时,需在头部引入<html lang="en" xmlns:th="http://www.thymeleaf.org">,
否则会报错-->
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>成功!</h1>
<!--th:text 将div里面的文本内容设置为 -->
<div th:text="${hello}">aa</div>
</body>
</html>
详细使用Thymeleaf参考资料:
1. Springboot之Thymeleaf 入门(环境搭建)
2. CSDN-史上最详 Thymeleaf 使用教程
3. Thymeleaf 教程:使用Thymeleaf[官方]