Thymeleaf从入门到清晰使用

news2025/1/19 3:30:13

文章目录

  • 什么是thymeleaf?
  • 第一个Thymeleaf程序
  • Thymeleaf详解
    • 配置
    • 常用标签
  • 最后


什么是thymeleaf?

模板引擎:

前端交给我们的页面,是html页面,如果是以前开发,我们需要把他们转成jsp页面,jsp的好处是当我们查出一些数据转发给jsp页面后,我们可以使用jsp实现数据的显示,及交互等。jsp支持非常强大的功能,包括能写Java代码。这其中的jsp也是模板引擎,模板引擎的功能就类似我们的会议室开会一样开箱即用,将模板设计好之后直接填充数据即可而不需要重新设计整个页面。提高页面、代码的复用性。

但是:springboot这个项目首先是以jar的方式,不是war,第二,我们用的还是嵌入式的Tomcat,所以他默认是不支持jsp,对此springboot推荐我们使用Thymeleaf模板引擎

Thymeleaf的好处:

  • 动静分离: Thymeleaf选用html作为模板页,这是任何一款其他模板引擎做不到的!Thymeleaf使用html通过一些特定标签语法代表其含义,但并未破坏html结构,即使无网络、不通过后端渲染也能在浏览器成功打开,大大方便界面的测试和修改。
  • 开箱即用: Thymeleaf提供标准和Spring标准两种方言,可以直接套用模板实现JSTL、 OGNL表达式效果,避免每天套模板、改JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言。
  • Springboot官方大力推荐和支持,Springboot官方做了很多默认配置,开发者只需编写对应html即可,大大减轻了上手难度和配置复杂度。

第一个Thymeleaf程序

IDEA基于Springboot构建第一个Thymeleaf程序

  1. 新建项目
    在这里插入图片描述
  2. 添加依赖
    IDEA的编译器做的很友好,可以直接选择热门的依赖而不需要去进行寻找,我们勾选其中Web 模块的Spring web依赖以及Template 模块的Thymeleaf依赖,参见上图,如果没有勾选这个依赖,也可以拷贝下面的代码
		<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
  1. 编写Controller,index.html

包结构如下:
在这里插入图片描述
其中:

  • controller:用来编写控制器,主要负责处理请求以及和视图(Thymeleaf)绑定。
  • static:用于存放静态资源,例如html、JavaScript、css以及图片等。
  • templates:用来存放模板引擎Thymeleaf(本质依然是.html文件)
package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @Author 秋名山码神
 * @Date 2023/1/11
 * @Description
 */
@Controller
public class IndexController {
    @RequestMapping("/index")
    public String index(Model model){
        model.addAttribute("msg","hello,springboot");
        return "index";
    }
}

代码含义如下:

  • @controller 注解的意思就是声明这个java文件为一个controller控制器。
  • @RequestMapping来映射URL(“index”)
  • model.addAttribute(“msg”,“hello,springboot”) 就是Model存入数据的书写方式,Model是一个特殊的类,相当于维护一个Map一样,而Model中的数据通过controller层的关联绑定在view层(即Thymeleaf中)可以直接使用。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--th:元素名字-->
<div th:text="${msg}"></div>
</body>
</html>

代码含义如下:

  • th:元素名称,$取出变量。是thymeleaf中的一个语法,我们后面来说
  1. 启动项目

访问:http://localhost:8080/index
在这里插入图片描述

Thymeleaf详解

刚刚我们已经创建好了第一个项目,但是那样远远满足不了我们真实开发中使用Thymeleaf,所以我们要对thymeleaf来进行更深层次的学习

配置

springboot官方提供的配置:

# THYMELEAF (ThymeleafAutoConfiguration)
spring.thymeleaf.cache=true # Whether to enable template caching.
spring.thymeleaf.check-template=true # Whether to check that the template exists before rendering it.
spring.thymeleaf.check-template-location=true # Whether to check that the templates location exists.
spring.thymeleaf.enabled=true # Whether to enable Thymeleaf view resolution for Web frameworks.
spring.thymeleaf.enable-spring-el-compiler=false # Enable the SpringEL compiler in SpringEL expressions.
spring.thymeleaf.encoding=UTF-8 # Template files encoding.
spring.thymeleaf.excluded-view-names= # Comma-separated list of view names (patterns allowed) that should be excluded from resolution.
spring.thymeleaf.mode=HTML # Template mode to be applied to templates. See also Thymeleaf's TemplateMode enum.
spring.thymeleaf.prefix=classpath:/templates/ # Prefix that gets prepended to view names when building a URL.
spring.thymeleaf.reactive.chunked-mode-view-names= # Comma-separated list of view names (patterns allowed) that should be the only ones executed in CHUNKED mode when a max chunk size is set.
spring.thymeleaf.reactive.full-mode-view-names= # Comma-separated list of view names (patterns allowed) that should be executed in FULL mode even if a max chunk size is set.
spring.thymeleaf.reactive.max-chunk-size=0 # Maximum size of data buffers used for writing to the response, in bytes.
spring.thymeleaf.reactive.media-types= # Media types supported by the view technology.
spring.thymeleaf.servlet.content-type=text/html # Content-Type value written to HTTP responses.
spring.thymeleaf.suffix=.html # Suffix that gets appended to view names when building a URL.
spring.thymeleaf.template-resolver-order= # Order of the template resolver in the chain.
spring.thymeleaf.view-names= # Comma-separated list of view names (patterns allowed) that can be resolved.

比较常用的有是否使用页面缓存spring.thymeleaf.cache=false,开发的时候不使用缓存,真正上线的时候为了缓解服务器压力使用缓存,还有使用编码utf-8spring.thymeleaf.encoding=UTF-8

常用标签

标签作用示例
th:id替换id<input th:id="${user.id}"/>
th:text文本替换<p text:="${user.name}">bigsai</p>
th:utex支持html的文本替换<p utext:="${htmlcontent}">content</p>
th:object替换对象<div th:object="${user}"></div>
th:value替换值<input th:value="${user.name}" >
th:each迭代<tr th:each="student:${user}" >
th:href替换超链接 <a th:href="@{index.html}">超链接</a>
th:src替换资源<script type="text/javascript" th:src="@{index.js}"></script>

最后

本篇旨在带你从一个对Thymeleaf概念为零的状态到一个能够较为清晰明了的认识和使用Thymeleaf,对于Thymeleaf的内容远远不止上面所涉及到的,对于一些算术运算、条件表达式等等其他内容还需要你自己到Thymeleaf官网去学习研究。

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

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

相关文章

ABB AC500 系列 PLC 与上位机iFix 的通讯配置

ABB PLC IP 及 MODBUS TCP/IP 协议设置 通过 IP config tool 配置设备 IP 在 软件中&#xff0c;有 3 种方式可以进入 IP config tool 的配置界面  双击 IP_settings&#xff0c;点击 IP config tool&#xff0c;即可进入 IP config tool 界面 点击菜单栏的 Tool→IP confi…

k8s 微服务spring boot JVM 监控

目录 1.前言 1.1 JVM监控方案 1.2 接入操作步骤 2. 服务开启actuator prometheus监控 2.1 示例参考添加依赖 2.2 配置prometheus监控 3 配置 prometheus 监控 4 配置jvm grafana dashboard 1.前言 服务 部署环境 监控 spring-demo k8s v1.22 Prometheus Operator …

进程相关概念

1、什么是程序&#xff0c;什么是进程&#xff0c;有什么区别 程序是静态的概念。例如&#xff1a;gcc xxx.c -o pro&#xff0c;磁盘中生成pro文件&#xff0c;叫做程序&#xff08;还未运行起来&#xff09; 进程是程序的一次运行活动&#xff0c;也就是程序跑起来了&#xf…

【Linux】信号机制(非实时信号)

目录 前言 一.信号的概念以及产生 1.什么是信号 2.信号分为两类 3.查看信号的命令 4.信号如何产生 1).通过软件产生 2).通过硬件产生 3).通过键盘组合键产生 二.信号的发送以及保存 1.信号如何发送 2.信号如何保存 1).概念 2).底层实现结构&&内核中的实现…

WampServer服务器设置控件

WampServer服务器设置控件 WampServer是一个web开发环境&#xff0c;是一个用于Windows操作系统的类似服务器的软件&#xff0c;由Romain Bourdon构建。该工具允许您开始构建web应用程序&#xff0c;并在Windows上使用Apache服务器2、PHP编程语言和MySQL数据库在本地网络上启动…

java 实现 springboot项目 使用socket推送消息,前端实时进行接收后端推送的消息

1 后端 1.1 添加依赖 在我们的springboot项目里面&#xff0c;添加依赖&#xff1b; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-websocket</artifactId><version>2.7.0</version>…

企业微信在职继承功能如何理解?怎么使用?

企业微信的在职继承功能就是企业管理员将在职员工的客户分配给其他在职员工跟进的一种方式&#xff0c;很方便&#xff0c;可以在工作出现变更时使用。 前言 企业微信之前的离职继承功能受到很多企业的青睐&#xff0c;企业能够将离职员工的客户分配给其他员工接手&#xff0c…

云天励飞在科创板获准注册:计划募资30亿元,陈宁为实际控制人

2023年1月10日&#xff0c;证监会发布公告&#xff0c;同意深圳云天励飞技术股份有限公司&#xff08;下称“云天励飞”&#xff09;首次公开发行股票注册。据贝多财经了解&#xff0c;云天励飞于2020年12月8日在科创板递交上市申请&#xff0c;2021年8月6日过会。 本次冲刺上市…

蓝队攻击的四个阶段(一)

蓝队的攻击是一项系统的工作&#xff0c;整个攻击过程是有章可循、科学合理的涵盖了从前期准备、攻击实施到靶标控制的各个步骤和环节。按照任务进度划分&#xff0c;一般可以将蓝队的工作分为4个阶段:准备工作、目标网情搜集、外网络向突破和内网横向拓展。第一阶段准备工作&a…

App开发提效法宝之插件技术

近年来技术革新频率越来越高&#xff0c;最近工作中经常有小伙伴问到插件技术的相关内容&#xff0c;今天就来跟大家系统的说清楚什么是插件技术以及它的好处。欢迎评论区交流哦&#xff01; 什么是插件技术&#xff1f; 插件技术指的是一种应用程序&#xff0c;遵循程序接口…

高温热水解预处理对厌氧消化期间污泥腐殖化的调控机制

期刊&#xff1a;Water Research 影响因子&#xff1a;9.13 发表时间&#xff1a;2022样本类型&#xff1a;污泥客户单位&#xff1a;同济大学凌恩生物客户同济大学发表在《Water Research》上的文章“The neglected effects of polysaccharide transformation on sludge humif…

振弦采集模块参数配置工具VMTool 的使用

振弦采集模块参数配置工具VMTool 的使用 准备工作 &#xff08; 1&#xff09; 将 VMXXX 模块的 UART_TTL、 RS232&#xff08; 或 RS485&#xff09; 接口与计算机的 COM 端口连接&#xff1b; &#xff08; 2&#xff09; 连接振弦传感器及温度传感器到 VMXXX 的对应接口&…

三菱FX3U系列PLC运动控制_伺服回原点的3种方法示例

三菱FX3U系列PLC运动控制_伺服回原点的3种方法示例 方法1: 运动的方向为圆形、环形、电机往一个方向转动; 只有一个原点开关,没有极限开关 如下图所示, 原点回归的方式为:启动回原点后,电机开始寻找原点开关,在找到原点开关的瞬间,开始减速;在离开原点开关的瞬间,电…

23. 反爬案例:不登录不给,要数据请先登录我的站点

登录之后&#xff0c;可以查看数据&#xff0c;是部分站点常用规则&#xff0c;本篇博客将在爬虫训练场中实现该需求。 文章目录安装必备模块建立 models建立 login_form 表单文件flask_wtf 中 FlaskForm 类建立登录视图函数配置 login.html 页面安装必备模块 实现 Python Fla…

Qt基于CTK Plugin Framework搭建插件框架--插件通信【事件监听】

文章目录一、前言二、事件三、类通信3.1、新建接收插件3.2、新建发送插件3.3、启用插件四、信号槽通信4.1、新建接收插件4.2、新建发送插件4.3、启用插件五、类通信和信号槽通信的区别六、插件依赖七、获取元数据一、前言 CTK框架中的事件监听&#xff0c;其实就是观察者模式&…

分享微信答题抽奖小程序制作步骤_可以做答题后抽奖活动吗

知识答题小程序如何制作&#xff1f;现在越来越多的企业和组织逐步进行各种获奖知识问答小程序。那么&#xff0c;如何制作一个答题小程序呢&#xff1f;今天&#xff0c;我们一起来看看~需要的老板不要走开哦~既然点进来了&#xff0c;那就请各位老板耐心看到最后吧~怎么做一个…

Linux工具学习之【git】

✨个人主页&#xff1a; Yohifo &#x1f389;所属专栏&#xff1a; Linux学习之旅 &#x1f38a;每篇一句&#xff1a; 图片来源 &#x1f383;操作环境&#xff1a; CentOS 7.6 阿里云远程服务器 Whatever is worth doing is worth doing well. 任何值得去做的事情&#xff0…

实现高并发秒杀的方式

实现高并发秒杀的方式 引言商品秒杀-超卖解决商品超卖 方式一&#xff08;改进版加锁&#xff09; 方式二&#xff08;AOP版加锁&#xff09; 方式三&#xff08;悲观锁一&#xff09; 方式四&#xff08;悲观锁二&#xff09; 方式五&#xff08;乐观锁&#xff09; 方式六&a…

【虹科云展厅专题】虹科赋能汽车智能化云展厅——自动驾驶专题

虹科2023年开年福利 聚焦前沿技术&#xff0c;【虹科赋能汽车智能化云展厅】正式上线&#xff0c;本次云展厅围绕“汽车以太网/TSN、汽车总线、智能网联、电子测试与验证、自动驾驶”等核心话题&#xff0c;为您带来如临展会现场般的讲演与介绍&#xff0c;更有技术工程师全程…

【CMake】基本指令

文章目录参考资料一、同一目录下单个源文件add_executable二、同一目录下多个源文件aux_source_directoryset( SRC_LIST ./main.c ./testFunc1.c ./testFunc.c)三、不同目录下多个源文件四、正规一点的组织结构add_subdirectoryset (EXECUTABLE_OUTPUT_PATH ${PROJECT_SOURCE_D…