Spring Boot 整合 Thymeleaf 实例分享

目录
  • 一、什么是 Thymeleaf
  • 二、整合过程
    • 准备过程
    • 添加 Thymeleaf 依赖
    • 编写实体类和 Controller
    • 创建Thymeleaf 模板
  • 三、测试

一、什么是 Thymeleaf

Thymeleaf 是新一代的 Java 模板引擎，类似于 Velocity、FreeMarker 等传统引擎，其语言和 HTML 很接近，而且扩展性更高；

Thymeleaf 的主要目的是将优雅的模板引入开发工作流程中，并将 HTML 在浏览器中正确显示。同时能够作为静态引擎，让开发成员之间更方便协作开发；

Spring Boot 官方推荐使用模板，而且 Spring Boot 也为 Thymeleaf 提供了完整的自动化 配置解决方案；

Thymeleaf 使用教程请戳 Tutorial: Using Thymeleaf，配合 Spring 使用的教程请戳 Tutorial: Thymeleaf + Spring。

二、整合过程

准备过程

正式开始整合过程之前，这里先给出本文的搭建环境，方便大家进行后续内容的学习。

  • JDK 11（理论上其他版本的 JDK 也是可以的，但是更为推荐 JDK 1.8 及以后的版本）
  • IDEA（这里没有啥要求，但我个人的话是出新的版本我就会更新，虽然臃肿，但是更新了确实好用 ）
  • SpringBoot 2.x（现在主流应该都是 2.x 版本，1.x 的都是老一点的版本了）

添加 Thymeleaf 依赖

添加 Thymeleaf 依赖有两种方式：

  • 第一种

在新建项目时添加，在 Templeate Engines 中勾选 Thymeleaf；

  • 第二种

对于忘记在新建项目时未添加 Thymeleaf 依赖的项目，可以直接在项目的 pom.xml 中手动添加依赖即可；

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

编写实体类和 Controller

  • 新建实体类 User

这里因为使用 Lombok，所以省去了各种 setter、getter，同时还省去了各种构造方法和重写 toString() 等方法，大大简化了代码。而我们所要做的，仅仅是在 pom.xml 中添加 Lombok 的依赖，然后在我们的实体类中加入对应的注解即可。

以下是在 pom.xml 中插入 Lombok 依赖的对应代码。

<dependency>
    <groupId>org.projectlombok</groupId>
    <artifactId>lombok</artifactId>
    <optional>true</optional>
</dependency>

然后我们就可以编写我们的实体类，这里主要用到了 @Data、@Component、@AllArgsConstructor 、NoArgsConstructor 四个注解，其中各个注解的含义如下：

  • @Component：把类实例化到 Spring 容器，相当于在配置文件中配置；
  • @Data ：给类的所有属性提供 get 和 set 方法，此外还有 equals、canEqual、hashCode、toString 方法以及 默认参数为空的构造方法；
  • @AllArgsConstructor：为类提供一个 全参构造方法，但此时不再提供默认构造方法；
  • @NoArgsConstructor：因为使用了 AllArgsConstructor 会导致类没有默认空参构造方法，所以此时需要它为类提供一个 无参构造方法；
package com.cunyu.pojo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.springframework.stereotype.Component;

/**
 * @author : cunyu
 * @version : 1.0
 * @className : User
 * @date : 2020/7/29 16:20
 * @description : User 实体类
 */

@Component
@Data
@AllArgsConstructor
@NoArgsConstructor
public class User {
    private int age;
    private String name;
    private String email;
}
  • 编写 Controller

此时主要需要注意的是 setViewName() 和 addObject()，前者表示方法对应的前端页面，也就是我们模板中对应文件名的 .html 文件，而后者则主要给属性注入值，然后将属性传递到前端模板。

package com.cunyu.controller;

import com.cunyu.pojo.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

/**
 * @author : cunyu
 * @version : 1.0
 * @className : UserController
 * @date : 2020/7/29 16:22
 * @description : UserController
 */

@Controller
public class UserController {

    // 访问 ip:port/index
    @GetMapping("/index")
    public ModelAndView index() {
        ModelAndView modelAndView = new ModelAndView();
        // 设置跳转的视图，即位于 templates/index.html
        modelAndView.setViewName("index");
        modelAndView.addObject("title", "Thymeleaf 使用");
        modelAndView.addObject("desc", "Spring Boot 整合 Thymeleaf");

        User author = new User(25, "村雨遥", "747731461@qq.com");

        modelAndView.addObject("author", author);
        return modelAndView;
    }
}

创建Thymeleaf 模板

第上面的代码中，我们设置了跳转的视图为 index，所以我们需要在 src/main/resources/templates 中创建 index.html。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <!-- 即 Controller 中的 title 属性 -->
    <title th:text="${title}"></title>

</head>
<body>
<!-- 即 Controller 中的 desc 属性 -->
<h1 th:text="${desc}" th:align="center"></h1>

<!-- 即 Controller 中的 author 信息 -->
<h2 th:align="center">=====作者信息=====</h2>
<p th:text="${author?.name}"></p>
<p th:text="${author?.age}"></p>
<p th:text="${author?.email}"></p>
</body>
</html>

三、测试

启动项目，然后在浏览器中访问 http://localhost:8080/index，如果出现下图中的信息，说明整合成功。

注意事项：

为了方便使用，我们在使用 Thymeleaf 模板时，可以添加一些自己的配置。而添加的位置则是项目的配置文件 application.yml，项目默认配置文件应该是 application.properties，但 SpringBoot 更加推荐使用 yml 来配置，所以我们这里需要手动将其改为 yml 的格式。

spring:
  thymeleaf:
    cache: false
    prefix: classpath:/templates/
    suffix: .html
    mode: HTML
    encoding: UTF-8
    servlet:
      content-type: text/html

总结：

本文主要介绍了 Themeleaf 的相关简介，然后对利用 SpringBoot 整合 Thymeleaf 的过程进行了描述，最后则是使用 Thymeleaf 中常用的一些相关配置的注意事项。

到此这篇关于Spring Boot 整合 Thymeleaf 详情的文章就介绍到这了,更多相关Spring Boot 整合 Thymeleaf 内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • SpringBoot Security安装配置及Thymeleaf整合

    功能:解决web站点的登录,权限验证,授权等功能 优点:在不影响站点业务代码,可以权限的授权与验证横切到业务中 1.要添加的依赖 <!--thymeleaf--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <!

  • SpringBoot整合thymeleaf 报错的解决方案

    SpringBoot整合thymeleaf 报错的解决方案

    近日 在springboot项目中使用thymeleaf时,莫名报了以下错误: 在网上查找文章明白了报错的原因,这是由于如果使用thymeleaf 为模板,那么解析时就要求html必须为严格的html5格式,即必须有完整的结束标记, 不然就会报错. 在html页面中,诸如input,meta,link等标签 ,是可以不用闭合就可以被解析的(自闭合的),但是由于这里严格要求html5格式 于是解决办法如下: 1) 在报错的标签上加入 结束标签. 2) 修改为不严格的模式. 在配置文件中加入如下配置

  • springboot+thymeleaf整合阿里云OOS对象存储图片的实现

    springboot+thymeleaf整合阿里云OOS对象存储图片的实现

    目录 1.先引入pom依赖 2.编写前端thymleeaf代码tetsfile.html 3.service层编写 4.controller层编写 今天再进行创建项目时想使用阿里云oos进行存储图片 下面进行实操 1.先引入pom依赖 <dependency> <groupId>com.aliyun.oss</groupId> <artifactId>aliyun-sdk-oss</artifactId> <version>3.9.1

  • springboot2.1.7整合thymeleaf代码实例

    这篇文章主要介绍了springboot2.1.7整合thymeleaf代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.在pom里面添加thymeleaf依赖 <!--thymeleaf--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymelea

  • Spring Boot和Thymeleaf整合结合JPA实现分页效果(实例代码)

    Spring Boot和Thymeleaf整合结合JPA实现分页效果(实例代码)

    在项目里,我需要做一个Spring Boot结合Thymeleaf前端模版,结合JPA实现分页的演示效果.做的时候发现有些问题,也查了现有网上的不少文档,发现能全栈实现的不多,所以这里我就把我的做法,全部代码和步骤贴出来供大家参考. 1 创建项目,用pom.xml引入依赖 这里将创建名为ThymeleafWithDB的Maven,在pom.xml里引入如下的依赖包. <dependencies> <dependency> <groupId>org.springframe

  • Spring Boot 整合 Shiro+Thymeleaf过程解析

    这篇文章主要介绍了Spring Boot 整合 Shiro+Thymeleaf过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.导包 <!-- springboot 与 shiro 的集成--> <dependency> <groupId>org.apache.shiro</groupId> <artifactId>shiro-spring</artifactId> <

  • SpringBoot整合Thymeleaf小项目及详细流程

    SpringBoot整合Thymeleaf小项目及详细流程

    目录 1.项目简绍 2.设计流程 3.项目展示 4.主要代码 1.验证码的生成 2.userController的控制层设计 3.employeeController控制层的代码 4.前端控制配置类 5.过滤器 6.yml配置 7.文章添加页面展示 8.POM.xml配置类 9.employeeMapper配置类 10.UserMapper配置类 1.项目简绍 本项目使用SpringBoot开发,jdbc5.1.48 Mybatis 源码可下载 其中涉及功能有:Mybatis的使用,Thymel

  • SpringBoot整合Thymeleaf的方法

    简介: 在目前的企业级应用开发中 前后端分离是趋势,但是视图层技术还占有一席之地, Spring Boot 对视图层技术提供了很好的支持,官方推荐使用的模板引擎是 Thymeleaf 不过像 FreeMarker 也支持, JSP 技术在这里并不推荐使用. Thymeleaf 是新一代 Java 模板引擎,类似于 Velocity.FreeMarker 等传统 Java 模板引擎.与传统 Java 模板引擎不同的是 Thymeleaf 支持 HTML 原型,既可 以让前端工程师在浏览器中直接打

  • springboot整合shiro之thymeleaf使用shiro标签的方法

    springboot整合shiro之thymeleaf使用shiro标签的方法

    thymeleaf介绍 简单说, Thymeleaf 是一个跟 Velocity.FreeMarker 类似的模板引擎,它可以完全替代 JSP .相较与其他的模板引擎,它有如下三个极吸引人的特点: 1.Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果.这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板+数据的展示方式.浏览器解释 html 时会忽略未定义的标签属性,所以 t

  • Spring Boot 整合 Thymeleaf 实例分享

    Spring Boot 整合 Thymeleaf 实例分享

    目录 一.什么是 Thymeleaf 二.整合过程 准备过程 添加 Thymeleaf 依赖 编写实体类和 Controller 创建Thymeleaf 模板 三.测试 一.什么是 Thymeleaf Thymeleaf 是新一代的 Java 模板引擎,类似于 Velocity.FreeMarker 等传统引擎,其语言和 HTML 很接近,而且扩展性更高: Thymeleaf 的主要目的是将优雅的模板引入开发工作流程中,并将 HTML 在浏览器中正确显示.同时能够作为静态引擎,让开发成员之间更方

  • Spring Boot 整合 FreeMarker 实例分享

    Spring Boot 整合 FreeMarker 实例分享

    目录 一.前言 二.FreeMarker 简介 三.准备工作 环境准备 添加 FreeMarker 依赖 添加 FreeMarker 相关配置 四.编写实体类和 Controller 编写实体类 编写 Controller 数据渲染 五.总结 一.前言 在之前的文章Spring Boot 整合 Thymeleaf 实例分享中,我们学习了如何将模板 Thymeleaf 整合到 Spring Boot 中,那今天我们就来看看,另一个老牌的开源免费模板引擎 - FreeMarker! 二.FreeMa

  • Spring Boot整合RabbitMQ实例（Topic模式）

    Spring Boot整合RabbitMQ实例（Topic模式）

    1.Topic交换器介绍 Topic Exchange 转发消息主要是根据通配符. 在这种交换机下,队列和交换机的绑定会定义一种路由模式,那么,通配符就要在这种路由模式和路由键之间匹配后交换机才能转发消息. 在这种交换机模式下: 路由键必须是一串字符,用句号(.) 隔开,比如说 agreements.us,或者 agreements.eu.stockholm 等. 路由模式必须包含一个 星号(*),主要用于匹配路由键指定位置的一个单词,比如说,一个路由模式是这样子:agreements..b.*

  • Spring Boot整合Thymeleaf详解

    Spring Boot整合Thymeleaf详解

    目录 Thymeleaf 基本介绍 基本语法 th:text文本替换 th:if和th:unless文本替换 th:each foreach循环 th:id.th:value.th:checked等(和form表单相关) 整合Thymeleaf 基本配置 三层架构 删除操作 编辑操作 用户登录 用户注销 点击注销用户 Thymeleaf 基本介绍 Spring Boot 官方推荐使用 Thymeleaf 作为其模板引擎.SpringBoot 为 Thymeleaf 提供了一系列默认配置,并且为T

  • Spring Boot 整合 Reactor实例详解

    目录 引言 1 创建项目 2 集成 H2 数据库 3 创建测试类 3.1 user 实体 3.2 UserRepository 3.3 UserService 3.4 UserController 3.5 SpringReactorApplication 添加注解支持 测试 总结 引言 Reactor 是一个完全非阻塞的 JVM 响应式编程基础,有着高效的需求管理(背压的形式).它直接整合 Java8 的函数式 API,尤其是 CompletableFuture, Stream,还有 Durat

  • spring boot整合RabbitMQ实例详解（Fanout模式）

    spring boot整合RabbitMQ实例详解（Fanout模式）

    1.Fanout Exchange介绍 Fanout Exchange 消息广播的模式,不管路由键或者是路由模式,会把消息发给绑定给它的全部队列,如果配置了routing_key会被忽略. 如上图所示,即当使用fanout交换器时,他会将消息广播到与该交换器绑定的所有队列上,这有利于你对单条消息做不同的反应. 例如存在以下场景:一个web服务要在用户完善信息时,获得积分奖励,这样你就可以创建两个对列,一个用来处理用户信息的请求,另一个对列获取这条消息是来完成积分奖励的任务. 2.代码示例 1).

  • Spring Boot整合RabbitMQ开发实战详解

    Spring Boot整合RabbitMQ开发实战详解

    这篇文章主要讲基本的整合.先把代码跑起来,再说什么高级特性. RabbitMQ 中的一些术语 如果你打开 RabbitMQ web 控制台,你会发现其中有一个 Exhanges 不好理解.下面简单说明一下. 交换器(Exchange) 交换器就像路由器,我们先是把消息发到交换器,然后交换器再根据路由键(routingKey)把消息投递到对应的队列.(明白这个概念很重要,后面的代码里面充分体现了这一点) 队列(Queue) 队列很好理解,就不用解释了. 绑定(Binding) 交换器怎么知道把这条

  • Spring Boot整合mybatis(一)实例代码

    sprig-boot是一个微服务架构,加快了spring工程快速开发,以及简便了配置.接下来开始spring-boot与mybatis的整合. 1.创建一个maven工程命名为spring-boot-entity,pom.xml文件配置如下: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:s

随机推荐