当前位置：首页 > news >正文

SpringBoot——整合Thymeleaf模板

news 来源：原创 2024/9/29 5:24:37

模板引擎

新建一个SpringBoot项目

pom.xml

application.properties

Book

BookController

bookList.html

编辑项目总结

模板引擎

模板引擎是为了用户界面与业务数据分离而产生的，可以生成特定格式的页面
在Java中，主要的模板引擎有JSP（少用），Thyemeleaf，FreeMarker，Velocity等
现在的大趋势是前后端分离开发，但如果自己写一些练手项目，使用模板引擎更快更方便
Thymeleaf可以快速实现表单绑定、属性编辑器、国际化等功能
Thymeleaf的基本语法规则：
1、基础语法 - Thymeleaf 教程 (hxstrive.com)
2、http://t.csdnimg.cn/aFWSO
3、http://t.csdnimg.cn/Oa4rZ
在此之前，控制器都是直接返回字符串，或者是跳转到其他URL地址，但使用Thymeleaf后，就可以让控制器跳转到项目中的某个 .html 文件
SpringBoot项目中所有页面文件都要放在 src/main/resources/templates 目录下，静态文件放在 src/main/static 目录下

项目总结

添加Thymeleaf依赖：首先，在你的Spring Boot项目的pom.xml文件中添加Thymeleaf的依赖。这样Spring Boot会自动配置Thymeleaf。
创建Thymeleaf模板文件：在src/main/resources/templates目录下创建Thymeleaf模板文件。Thymeleaf使用HTML文件作为模板，你可以在其中使用Thymeleaf的语法来动态渲染页面。
创建控制器：创建一个Spring MVC控制器，在其中设置需要在模板中渲染的数据。

启动应用程序：运行Spring Boot应用程序，访问控制器中定义的URL，应该会看到使用Thymeleaf模板渲染的页面。

在项目开发中将Spring Boot框架、Thymeleaf与Spring MVC的视图技术及SpringBoot 的自动化配置集成在一起非常简便，不需要额外的配置，在开发中只需要关注Thymeleaf的语法即可

新建一个SpringBoot项目

项目结构：

pom.xml

主要引入Thymeleaf依赖

        <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency>

<?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 https://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><!--最初的3.2.5版本太高了,需要手动降低成2.3.12--><version>2.3.12.RELEASE</version><relativePath/> <!-- lookup parent from repository --></parent><groupId>com</groupId><artifactId>springboot_thymeleaf</artifactId><version>0.0.1-SNAPSHOT</version><name>springboot_thymeleaf</name><description>Demo project for Spring Boot</description><properties><java.version>8</java.version></properties><dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-test</artifactId><scope>test</scope></dependency><!--添加Thymeleaf依赖--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins></build></project>

application.properties

spring.application.name=springboot_thymeleaf
server.port=8080
# 访问template下的html文件
spring.thymeleaf.prefix=classpath:/templates/
# 开发时关闭缓存,不然没法看到实时页
spring.thymeleaf.cache=false
# 设置Thymeleaf页面的后缀为.html
spring.thymeleaf.suffix=.html

Book实体类

package com.springboot_thymeleaf;import java.util.Date;/*** 实体类*/
public class Book {private Integer id;private String name;private Date createTime;private String author;//getter,setter方法
}

BookController控制器

Thymeleaf会根据控制器返回的字符串值，寻找templates文件夹下同名的网页文件，并跳转至该网页文件，比如下例，就是跳转到bookList.html文件

在 Spring 框架中，Model 和 ModelAndView 是用于在控制器中向视图传递数据的两种方式，在 Spring Boot 项目中，通常建议使用 Model，因为它更简单直观，适合大多数情况。只有在需要更复杂的场景或更精确地控制视图名称时，才需要使用 ModelAndView。

package com.springboot_thymeleaf.controller;import com.springboot_thymeleaf.Book;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.servlet.ModelAndView;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;/*** @Controller：这是一个Spring框架的注解，它用于将类标记为控制器（Controller）。* 使用@Controller注解的类被Spring认为是处理HTTP请求的控制器，* 并且可以处理来自客户端的请求。它通常与@RequestMapping注解一起使用，用于映射URL路径到相应的处理方法。*/
@Controller
public class BookController {/*** @GetMapping("/books"): 这是一个Spring框架的注解，它用于映射HTTP GET请求到处理方法。* 在BookController中，@GetMapping("/books")注解表示当浏览器发起GET请求到"/books"路径时，* 将调用books()方法来处理该请求。books()方法会返回一个ModelAndView对象，用于渲染书籍列表的视图。*/@GetMapping("/books")public String books(Model model){// 添加两本书的记录List<Book> books = new ArrayList<>();Book book1 = new Book();book1.setId(1);book1.setName("Spring Boot企业级应用开发");book1.setCreateTime(new Date());book1.setAuthor("李白");Book book2 = new Book();book2.setId(2);book2.setName("Node.js Web开发实战");book2.setCreateTime(new Date());book2.setAuthor("白居易");books.add(book1);books.add(book2);// 使用addAttribute(String attributeName, Object attributeValue)方法向Model中添加属性。// 属性的名称是一个字符串，可以在视图中使用它来检索属性值。属性值可以是任何Java对象，例如字符串、数字、集合等。model.addAttribute("books", books);return "bookList.html";}
}

bookList.html动态网页文件

<!DOCTYPE html>
<!--导入Thymeleaf的命名空间-->
<html lang="en" xmlns: xmlns:th="http://www.w3.org/1999/xhtml">
<head><meta charset="UTF-8"><title>图书列表</title>
</head>
<body>
<table border="1" width="100%"><tr><td>序号</td><td>书名</td><td>作者</td></tr><!--${}: 变量表达式,Thymeleaf获取一个值的语法是th:text="${title}"--><tr th:each="book:${books}"><!--四个单元格内容--><td th:text="${book.id}"/><td th:text="${book.name}"/><td th:text="${#dates.format(book.createTime,'yyyy-MM-dd')}"/><td th:text="${book.author}"/></tr>
</table></body>
</html>

启动项目，浏览器访问http://localhost:8080/books