SpringBoot——整合Thymeleaf模板

目录

模板引擎

新建一个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 目录下

项目总结

  1. 添加Thymeleaf依赖:首先,在你的Spring Boot项目的pom.xml文件中添加Thymeleaf的依赖。这样Spring Boot会自动配置Thymeleaf。
  2. 创建Thymeleaf模板文件:在src/main/resources/templates目录下创建Thymeleaf模板文件。Thymeleaf使用HTML文件作为模板,你可以在其中使用Thymeleaf的语法来动态渲染页面。
  3. 创建控制器:创建一个Spring MVC控制器,在其中设置需要在模板中渲染的数据。
  4. 启动应用程序:运行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 框架中,ModelModelAndView 是用于在控制器中向视图传递数据的两种方式,在 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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/15156.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python 闭包的高级用法详解

所谓闭包&#xff0c;就是指内函数使用了外函数的局部变量&#xff0c;并且外函数把内函数返回出来的过程&#xff0c;这个内函数称之为闭包函数。可以理解为是函数式编程中的封装。 内部函数可以使用外部函数定义的属性&#xff1a;外部函数调用后&#xff0c;返回内部函数的地…

Linux_web控制台-cockpit

1、安装cockpit [rootlocalhost ~]# dnf install cockpit -y 2、启动cockpit服务并查运行状态 [rootlocalhost ~]# systemctl start cockpit [rootlocalhost ~]# systemctl status cockpit 2、设置开机启动 [rootlocalhost ~]# vim /usr/lib/systemd/system/cockpit.servi…

局域网桌面监控软件哪个好用?良心推荐

如何有效地监控和管理内部员工的计算机使用行为&#xff0c;防范潜在的安全风险&#xff0c;提高工作效率&#xff0c;是众多企业管理者关注的焦点。 而一款优秀的局域网桌面监控软件无疑能为企业的IT治理提供有力支撑。 小编在此给大家推荐一款好用的局域网桌面监控软件——域…

5. C++网络编程-UDP协议的实现

UDP是无连接的。 UDP Server网络编程基本步骤 创建socket&#xff0c;指定使用UDP协议将socket与地址和端口绑定使用recv/send接收/发送数据 由于UDP是无连接的&#xff0c;直接侦听就行使用close关闭连接 这个UDP接收数据的时候用的API是recvfrom,发送数据是sendto

MCS-51伪指令

上篇我们讲了汇编指令格式&#xff0c;寻址方式和指令系统分类&#xff0c;这篇我们讲一下单片机伪指令。 伪指令是汇编程序中用于指示汇编程序如何对源程序进行汇编的指令。伪指令不同于指令&#xff0c;在汇编时并不翻译成机器代码&#xff0c;只是会汇编过程进行相应的控制…

已有yarn集群部署spark

已有yarn集群的情况下&#xff0c;部署spark只需要部署客户端。 一、前提条件 已部署yarn集群&#xff0c;部署方式参考&#xff1a;https://blog.csdn.net/weixin_39750084/article/details/136750613?spm1001.2014.3001.5502&#xff0c;我部署的hadoop版本是3.3.6已安装j…

Android Compose 九:常用组件列表 简单使用

遇事不决 先看官方文档 列表和网格 如果不需要任何滚动&#xff0c;通过Column 或 Row可以使用verticalScroll() 使Column滚动 Column(modifier Modifier.verticalScroll(rememberScrollState())) {for (i in 0..50){Text(text "条目>>${i}")}}显示大量列表…

从0开始linux(3)——如何读写文件

欢迎来到博主的专栏——从0开始linux 博主ID&#xff1a;代码小豪 文章目录 创建普通文件用文本编辑器nano写入文件如何读取文件cat命令less命令head和tail 我们前面已经了解和如何操作文件&#xff0c;但是目前认识的文件类型分为两类&#xff0c;一类是目录文件、另一类是普通…

【C#上位机应用开发实战】—— 通信模块的基础与实践

&#x1f680; 引言 在工业自动化、设备监控、物联网&#xff08;IoT&#xff09;等领域&#xff0c;上位机软件扮演着至关重要的角色。作为连接人与设备的桥梁&#xff0c;上位机软件不仅需要提供友好的用户界面&#xff0c;更需要具备高效、稳定的通信能力。今天&#xff0c…

ASP+ACCESS教师档案管理系统

3.1 系统功能模块图 3.2 E&#xff0d;R模型图 3.3 系统使用流程图 3.4 各个模块功能简介&#xff1a; 本系统分为五个功能模块&#xff0c;它们分别是教师信息录入模块、教师信息修改模块、教师信息查询模块、教师信息打印模块。 下面分别介绍各个模块的功能用途&#x…

第 398 场 LeetCode 周赛题解

A 特殊数组 I 模拟&#xff1a;遍历数组判断是否是一个特殊数组 class Solution { public:bool isArraySpecial(vector<int>& nums) {int r 0;while (r 1 < nums.size() && nums[r 1] % 2 ! nums[r] % 2)r;return r nums.size() - 1;} };B 特殊数组 I…

计网(部分在session学习章)

TCP/UDP TCP:面向连接,先三次握手建立连接,可靠传输。 UDP:无连接,不可靠,传递的快。 TCP可靠传输 1.分块编号传输; 2.校验和,校验首部和数据的检验和,检测数据在传输中的变化; 3.丢弃重复数据; 4.流量控制,TCP 利⽤滑动窗⼝实现流量控制。TCP的拥塞控制采⽤…

基于Matlab卷积神经网络人脸识别

欢迎大家点赞、收藏、关注、评论啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统四. 总结 一项目简介 一、项目背景与意义 人脸识别作为计算机视觉领域的关键技术之一&#xff0c;具有广泛的应用前景&#xff0c;如安全…

Add object from object library 从对象库中添加内置器件

Add object from object library 从对象库中添加内置器件 正文正文 对于 Lumerical,有些时候我们在使用中,可能需要从 Object library 中添加器件,通常我们的做法是手动添加。如下图所示,我们添加一个 Directional Coupler 到我们的工程文件中: 但是这种操作方式不够智能…

基于HTML5和CSS3搭建一个Web网页(二)

倘若代码中有任何问题或疑问&#xff0c;欢迎留言交流~ 网页描述 创建一个包含导航栏、主内容区域和页脚的响应式网页。 需求: 导航栏: 在页面顶部创建一个导航栏&#xff0c;包含首页、关于我们、服务和联系我们等链接。 设置导航栏样式&#xff0c;包括字体、颜色和背景颜…

上门服务系统开发|东邻到家系统|上门服务系统开发流程

上门服务小程序的开发流程是一个复杂且精细的过程&#xff0c;涉及到需求分析、设计规划、开发实施、测试验收以及上线运营等多个环节。下面将详细介绍上门服务小程序的开发流程&#xff0c;帮助读者全面了解并掌握其中的关键步骤。 一、需求分析 在开发上门服务小程序之前&am…

API攻击呈指数级增长,如何保障API安全?

从远程医疗、共享汽车到在线银行&#xff0c;实时API是构建数字业务的基础。然而&#xff0c;目前超过90%的基于Web的网络攻击都以API端点为目标&#xff0c;试图利用更新且较少为人所知的漏洞&#xff0c;而这些漏洞通常是由安全团队未主动监控的API所暴露&#xff0c;致使API…

24款奔驰GLE350升级原厂环视全景360影像 抬头显示HUD

奔驰GLE350原厂360全景影像的清晰度通常取决于车辆的具体型号和年份&#xff0c;以及安装的摄像头和显示屏质量。一般来说&#xff0c;原厂360全景影像系统会提供高清的影像&#xff0c;让驾驶者能够清晰地看到车辆周围的环境&#xff0c;帮助进行停车和转弯等操作抬头显示&…

AOP编程

AOP编程 AOP&#xff0c;面向切面编程&#xff0c;一种编程范式&#xff0c;指导开发者如何组织程序结构。 OOP&#xff0c;面向对象编程&#xff0c;一种编程思想。 AOP&#xff0c;提供了一种机制,可以将一些横切系统中多个模块的共同逻辑(如日志记录、事务管理、安全控制等…

WordPress搭建流程

1. 简介 WordPress 是一个 PHP 编写的网站制作平台。WordPress 本身免费,并且拥有众多的主题可以使用,适合用于搭建个人博客、公司官网、独立站等。 2. 环境准备 2.1 WordPress 下载 WordPress 可以在 Worpress中文官网 下载(如果后续要将后台调成中文的话,一定要从中文…