Thymeleaf学习总结

news/2025/3/6 23:15:28/文章来源:https://www.cnblogs.com/zyh-828/p/18756755

1. 模板引擎的作用

Spring Boot支持多种模板引擎(如Thymeleaf、FreeMarker、Velocity等),它们的主要作用是将动态数据与静态HTML模板结合,生成最终的HTML页面。模板引擎通过占位符、条件判断、循环等语法,使得页面内容可以根据后端数据动态变化。


2. Thymeleaf模板引擎的使用

Thymeleaf是Spring Boot官方推荐的模板引擎,具有以下特点:

  • 自然模板:Thymeleaf模板可以直接在浏览器中打开,无需后端渲染,便于前端开发调试。
  • 强大的表达式:支持Spring EL表达式,能够方便地访问后端传递的数据。
  • 与Spring Boot无缝集成:通过简单的配置即可使用。

关键语法:

  • 变量渲染${variable} 用于渲染后端传递的变量。
  • 条件判断th:ifth:unless 实现条件渲染。
  • 循环遍历th:each 用于遍历集合或数组。
  • 表单绑定th:objectth:field 用于表单数据绑定。

示例:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head><title>User List</title>
</head>
<body><h1>User List</h1><ul><li th:each="user : ${users}"><span th:text="${user.name}">Default Name</span></li></ul>
</body>
</html>

3. 后端数据传递

在Spring Boot中,控制器(Controller)通过Model对象将数据传递给模板。例如:

@Controller
public class UserController {@GetMapping("/users")public String getUsers(Model model) {List<User> users = userService.getAllUsers();model.addAttribute("users", users);return "user-list"; // 对应模板文件 user-list.html}
}

4. 模板文件的位置与配置

Spring Boot默认会从src/main/resources/templates目录下加载模板文件。如果需要自定义模板路径,可以在application.properties中配置:

spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html

5. 模板渲染的优势

  • 前后端分离:模板渲染将页面逻辑与业务逻辑分离,便于团队协作。
  • 代码复用:通过模板片段(Fragment)和布局(Layout),可以减少重复代码。
  • 动态性强:模板引擎支持条件、循环等逻辑,能够灵活生成动态内容。

6. 常见问题与解决

  • 模板缓存:在开发阶段,建议关闭模板缓存以便实时查看修改效果:
    spring.thymeleaf.cache=false
    
  • 静态资源加载:确保静态资源(CSS、JS)路径正确,通常放在src/main/resources/static目录下。
  • 模板语法错误:Thymeleaf语法错误可能导致页面渲染失败,需仔细检查模板文件。

7. 总结

通过学习和实践,我深刻体会到模板渲染在Spring Boot Web开发中的重要性。它不仅提高了开发效率,还使得页面逻辑更加清晰和易于维护。未来,我将进一步探索模板引擎的高级特性,如国际化支持、模板片段复用等,以提升开发能力和项目质量。

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

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

相关文章

极空间docker部署Ghost博客

1. 下载镜像搜索不到、下载不了的请挂代理或者换源2. 编辑容器 2.1 将content路径映射到nas本地2.2 映射本地端口到ghost端口 注意:极空间限制了3000以内的端口不可外部访问,所以要设置成>3000的端口,我这里设置的33682.3 配置环境变量 这里我选择sqlite3作为数据库,url…

19C++循环结构-多重循环(2)-——教学

1、三重循环与程序的优化; 2、四重循环; 3、超市收费程序一、三重循环与程序的优化 教学视频 百钱买百鸡 3文钱可以买1只公鸡,2文钱可以买1只母鸡,1文可以买3只小鸡,要用100文买100只(每种鸡必买1只)。 试编一程序,求公鸡,母鸡、小鸡各有多少只? 如果100文钱全部买公…

fastadmin + workman 实现websocket前后端通信http

1.安装workman扩展composer require workerman/workerman2.安装think-workercomposer require topthink/think-worker=1.0.* 3.如果在windows下使用,还需下载composer require workerman/workerman-for-win4.根目录创建server.php 。用来启动服务#!/usr/bin/env php <?php…

日报202536

继续学习了Springboot,感觉有点麻烦:User package com.xxx.demo1.pojo;public class User {String id;String name;@Overridepublic String toString() {return "User{" +"id=" + id + \ +", name=" + name + \ +};}public String getId() {re…

[JLOI2014] 路径龟划

传送门 我的部落格 貌似没有比较通俗介绍红绿灯期望介绍方法的?我来一发不需要积分基础能看懂的严谨证明~ 题目大意 这道题 luogu 题面不太清晰,大意给定一张无向图,你需要开车从起点走到终点,有些点会设红绿灯,给出每个红绿灯的红灯时间和绿灯时间,你见到红绿灯时红绿灯…

Vue 脚手架发展

Vue 脚手架是一个基于 Vue.js 进行快速开发的完整系统,Vue 脚手架致力于将 Vue 生态中的工具基础标准化。Vue 的工具链 CLI(通常指 @vue/cli)与 create-vue 是 Vue 生态中两个不同的脚手架工具,它们在功能定位、技术栈和适用场景上有显著区别。 Vue CLI(@vue/cli) Vue CL…

18C++循环结构-多重循环(1)

1、循环的嵌套; 2、双重循环的应用一、循环的嵌套 问题:#include <iostream> using namespace std; int main() {int j;for(j=1;j<=5;j++)cout<<*;return 0; }再编一程序,每次输出3行,每行5个"*"号。 在外层加一个循环语句来实现;流程图如:#inc…

Mybatis-plus01--快速开始

前言 在编写Java开发过程中,尤其是CRUD开发,我们会发现大部分事件都在编写Java持久层的增删改查上了,并且配置mybatis的mapper文件也是一件麻烦的事。如果你也有这样的烦劳,看来就可以认识一下我们的新朋友mybatis-plus了。 MyBatis-Plus 是一个 Mybatis的增强工具,在 MyB…

作业二:文本查重

作业介绍这个作业属于哪个课程 https://edu.cnblogs.com/campus/gdgy/SoftwareEngineeringClassof2023github https://github.com/Ryon-h/3123003446这个作业要求在哪里 https://edu.cnblogs.com/campus/gdgy/SoftwareEngineeringClassof2023/homework/13324这个作业的目标 完成…

上哪儿下载stable diffusion

要在本地环境中下载和安装Stable Diffusion,您可以遵循以下几种方法: 方法一:GitHub源码下载(工作流下载:https://www.mix688.com/964.html)硬件与软件环境准备:确保计算机配备至少4GB显存的NVIDIA GPU。安装Windows操作系统。准备大约10GB的硬盘空间。安装所需软件:下…

清华大学DeepSeek课程:基于DeepSeek的AI音乐词曲创作法(附视频下载)

本课程由清华大学新媒沈阳团队精心打造,旨在教授大家如何利用DeepSeek这一强大的AI工具进行音乐词曲创作。DeepSeek不仅能够帮助我们理解音乐创作的基本原理,还能激发我们的创造力。本课程由清华大学新媒沈阳团队精心打造,旨在教授大家如何利用DeepSeek这一强大的AI工具进行…