Thymeleaf基础及springboot整合Thymeleaf入门

最新推荐文章于 2024-07-22 08:30:00 发布

岚清

最新推荐文章于 2024-07-22 08:30:00 发布

阅读量418

点赞数

文章标签： spring boot java spring html

本文链接：https://blog.csdn.net/LPClan/article/details/121706076

版权

一.认识Thymeleaf

做过SSM-web项目的同学都知道，我们在HTML页面要与后端进行数据交互时，除了Ajax就别无他法，而且在HTML页面使用JSTL也是不支持的，那这时我们就要使用JSP页面-一个特殊的java类（本质是servlet），然而JSP与springboot的兼容性不好，不能一起打包入jar包，所以官方推出Thymeleaf来代替JSP。

二.Thymeleaf介绍

官方文档：thymeleaf是一个XML/XHTML/HTML5模板引擎，可用于Web与非Web环境中的应用开发。它是一个开源的Java库，基于Apache License 2.0许可。
Thymeleaf提供了一个用于整合Spring MVC的可选模块，在应用开发中，你可以使用Thymeleaf来完全代替JSP或其他模板引擎，如Velocity、FreeMarker等。Thymeleaf的主要目标在于提供一种可被浏览器正确显示的、格式良好的模板创建方式，因此也可以用作静态建模。你可以使用它创建经过验证的XML与HTML模板。相对于编写逻辑或代码，开发者只需将标签属性添加到模板中即可。接下来，这些标签属性就会在DOM（文档对象模型）上执行预先制定好的逻辑。
它的特点便是：开箱即用，动静结合，多方言支持，与SpringBoot完美整合。
Thymeleaf允许您处理六种模板，每种模板称为模板模式：

XML
有效的XML
XHTML
有效的XHTML
HTML5
旧版HTML5

三.Springboot整合thymeleaf

使用springboot 集成使用Thymeleaf实现的步骤如下：

创建一个sprinboot项目
添加thymeleaf的起步依赖
添加spring web的起步依赖
编写html 使用thymleaf的语法获取变量对应后台传递的值
编写controller 设置变量的值到model中

(1)创建一个独立的工程springboot-thymeleaf

导入pom.xml依赖

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>

<groupId>org.example</groupId>
<artifactId>SpringThymeleaf</artifactId>
<version>1.0-SNAPSHOT</version>
<--依赖管理-->
<parent>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-parent</artifactId>
	<version>2.1.4.RELEASE</version>
</parent>
<dependencies>
	<!--web起步依赖-->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-web</artifactId>
	</dependency>
	<!--thymeleaf配置-->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-thymeleaf</artifactId>
	</dependency>
</dependencies>
</project>

(2)创建包com.company.thymeleaf.thymeleaf.并创建启动类ThymeleafApplication

@SpringBootApplication
public class ThymeleafApplication {
	public static void main(String[] args) {
		SpringApplication.run(ThymeleafApplication.class,args);
	}
}

(3)创建application.yml

设置thymeleaf的缓存设置，设置为false。因为thymeleaf是默认加缓存的，测试要避免缓存对我们的干扰，故设置为false。

spring:
  thymeleaf:
    cache: false

(4)控制层-创建controller用于测试后台设置数据到model中。

创建com.company.thymeleaf.controller.TestController，代码如下：

@Controller
@RequestMapping("/test")
public class TestController {
	/***
	* 访问/test/hello 跳转到demo页面
	* @param model
	* @return String 
	*/
	@RequestMapping("/hello")
	public String hello(Model model){
		model.addAttribute("hello","hello welcome");
		return "demo";
	}
}

(5)创建html

在resources中创建templates目录，在templates目录创建 demo.html,代码如下：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>Thymeleaf的入门</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
	<!--输出hello数据-->
	<p th:text="${hello}"></p>
</body>
</html>

解释：

这句声明使用thymeleaf标签
<html  xmlns:th="http://www.thymeleaf.org" >

这句使用 th:text="${变量名}" 表示使用thymeleaf获取文本数据，类似于EL表达式
<p th:text="${hello}"></p>

(6)测试

启动系统，并在浏览器访问 http://localhost:8080/test/hello

在这里插入图片描述

结语：

下篇：Thymeleaf常用语法： https://blog.csdn.net/LPClan/article/details/121768083?spm=1001.2014.3001.5501

岚清

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫