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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

探索Python编程世界:从基础到实战

新书上架~&#x1f447;全国包邮奥~ python实用小工具开发教程http://pythontoolsteach.com/3 欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一、Python语言简介与动态特性 代码示例&#xff1a;动态类型与变量命名 二、Python应用领…

【软件设计师】大题

一、数据流图 基础知识 数据流图&#xff08;Data Flow Diagram,DFD&#xff09;基本图形元素&#xff1a; 外部实体&#xff08;External Agent&#xff09; 表示存在于系统之外的对象&#xff0c;用来帮助用户理解系统数据的来源和去向加工&#xff08;Process&#xff09;数…

犀牛8 for Mac/Win:重塑三维建模的新标杆

在数字创意的浪潮中&#xff0c;犀牛8&#xff08;Rhinoceros 8&#xff09;作为一款卓越的三维建模软件&#xff0c;以其强大的功能和出色的性能&#xff0c;在Mac和Windows平台上都赢得了广大设计师和工程师的青睐。 犀牛8不仅继承了前代产品的优秀基因&#xff0c;更在细节…

从 0 开始本地部署大语言模型

1、准备 ● Ollama&#xff1a;ollama.com ● Docker&#xff1a;https://docs.openwebui.com/ 2、下载 Ollama 进入 Ollama 官网&#xff0c;点击 Download 。 下载完成后&#xff0c;双击安装&#xff0c;什么都不需要勾选&#xff0c;直接下一步即可。安装完成&#xf…

[读论文]精读Self-Attentive Sequential Recommendation

论文链接&#xff1a;https://arxiv.org/abs/1808.09781 其他解读文章&#xff1a;https://mp.weixin.qq.com/s/cRQi3FBi9OMdO7imK2Y4Ew 摘要 顺序动态是许多现代推荐系统的一个关键特征&#xff0c;这些系统试图根据用户最近执行的操作来捕获用户活动的“上下文”。为了捕捉…

Hive运行错误

Hive 文章目录 Hive错误日志错误SessionHiveMetaStoreClientql.Driver: FAILED: Execution Error, return code 2 from org.apache.hadoop.hive.ql.exec.mr.MapRedTaskerror: Could not find or load main class org.apache.hadoop.mapreduce.v2.app.MRAppMaster Please check …

GIT 新建分支和合并分支

文章目录 前言一、新建分支二、切回老分支&#xff0c;保留新分支的更改三、合并分支 前言 本文主要针对以下场景进行介绍&#xff1a; 场景一&#xff1a;创建新的分支 当前分支(dev_1)已经开发完毕&#xff0c;下一期的需求需要在新分支(dev_2)上进行开发&#xff0c;如何创…

每日5题Day8 - LeetCode 36 - 40

每一步向前都是向自己的梦想更近一步&#xff0c;坚持不懈&#xff0c;勇往直前&#xff01; 第一题&#xff1a;36. 有效的数独 - 力扣&#xff08;LeetCode&#xff09; 题目要求我们进行判断&#xff0c;我们不需要自己填写&#xff0c;所以要一个标志位&#xff0c;来看当…

LLM——探索大语言模型在心理学方面的应用研究

1. 概述 心理学经历了多次理论变革&#xff0c;目前人工智能&#xff08;AI&#xff09;和机器学习&#xff0c;特别是大型语言模型&#xff08;LLMs&#xff09;的使用&#xff0c;预示着新研究方向的开启。本文详细探讨了像ChatGPT这样的LLMs如何转变心理学研究。它讨论了LL…

从旅游广告联想到《桃花源记》

近日收到《长江头条网》等知名网络自媒体相邀,促我写点儿旅游题材的文案。虽说笔者游历过许多名山大川的绝美风景区,但那是在70岁之前的事儿了。如今年逾78岁,纵使有少许自有资本能够支持出游,可体力难撑,岂不是花钱买罪受吗?而且,写没有亲身经历过的事挺难,即便发表出…

台灯的功能作用有哪些?护眼台灯真的护眼吗?

现在的学生会长时间使用平板、手机、电脑等&#xff0c;这些设备的屏幕会产生一定的频闪和蓝光辐射&#xff0c;也就会影响视力健康&#xff0c;而护眼养眼也成了家长关注的问题&#xff0c;视力疲劳和眼部疾病不仅影响个体的生活质量&#xff0c;还可能导致长期的健康问题。当…

装修:尽显个性品味

家&#xff0c;是心灵的港湾&#xff0c;也是生活的舞台。装修&#xff0c;不仅是对空间的改造&#xff0c;更是对生活态度的诠释。无论是温馨的北欧风&#xff0c;还是华丽的欧式古典&#xff0c;或是简约的现代感&#xff0c;我们的专业团队都能为您量身打造。每一个细节&…

力扣--哈希表13.罗马数字转整数

首先我们可以知道&#xff0c;一个整数&#xff0c;最多由2个罗马数字组成。 思路分析 这个方法能够正确将罗马数字转换为阿拉伯数字的原因在于它遵循了罗马数字的规则&#xff0c;并且对这些规则进行了正确的编码和处理。 罗马数字规则 罗马数字由以下字符组成&#xff1a…

如何使用ffmpeg 实现10种特效

相关特效的名字 特效id 特效名 1 向上移动 2 向左移动 3 向下移动 4 颤抖 5 摇摆 6 雨刷 7 弹入 8 弹簧 9 轻微跳动 10 跳动 特效展示(同时汇总相关命令) pad背景显示 pad背景透明 相关命令(一会再讲这些命令&#xff0c;先往下看) # 合成特效语音 ffmpeg -y -loglevel erro…

Pandas高效数据清洗与转换技巧指南【数据预处理】

三、数据处理 1.合并数据&#xff08;join、merge、concat函数&#xff0c;append函数&#xff09; Concat()函数使用 1.concat操作可以将两个pandas表在垂直方向上进行粘合或者堆叠。 join属性为outer&#xff0c;或默认时&#xff0c;返回列名并集&#xff0c;如&#xff…

day34 贪心算法 455.分发饼干 376. 摆动序列

贪心算法理论基础 贪心的本质是选择每一阶段的局部最优&#xff0c;从而达到全局最优。 贪心一般解题步骤&#xff08;贪心无套路&#xff09;&#xff1a; 将问题分解为若干个子问题找出适合的贪心策略求解每一个子问题的最优解将局部最优解堆叠成全局最优解 455.分发饼干 …

2024年最全的信息安全、数据安全、网络安全标准分享(可下载)

以上是资料简介和目录&#xff0c;如需下载&#xff0c;请前往星球获取&#xff1a;https://t.zsxq.com/Gz1a0

Unity3D雨雪粒子特效(Particle System)

系列文章目录 unity工具 文章目录 系列文章目录&#x1f449;前言&#x1f449;一、下雨的特效1-1.首先就是创建一个自带的粒子系统,整几张贴图,设置一下就能实现想要的效果了1-2 接着往下看视频效果 &#x1f449;二、下雪的特效&#x1f449;三、下雪有积雪的效果3-1 先把控…

基于Android studio 订餐、外卖系统

目录 项目介绍 图片展示 运行环境 获取方式 项目介绍 具有登录&#xff0c;注册&#xff0c;修改密码&#xff0c;查看关于开发信息(可以填写自己的信息) 我的&#xff1a;可以查看菜品详情&#xff0c;填写份数&#xff0c;加入购物车&#xff0c; 购物车&#xff1a;可…

ElasticSearch操作之重置密码脚本

ElasticSearch操作之重置密码脚本 #!/bin/bash # 使用样例 ./ES密码重置.sh 旧密码 新密码# 输入旧密码 es_old_password$1# 设置新的密码变量 es_password$2# 正确响应 es_reponse{"acknowledged":true}# 检查Elasticsearch是否在运行 if pgrep -f elasticsearch &g…