Thymeleaf模版引擎
Thymeleaf是面向Web和独立环境的现代服务器端Java模版引擎,能够处理HTML、XML、JavaScript、CSS甚至纯文本。Thymeleaf旨在提供一个优雅的、高度可维护的创建模版的方式。为了实现这一目标,Thymeleaf建立在自然模版的概念上,将其逻辑注入到模版文件中,不会影响模版设计原型,从而改善了设计的沟通,弥合了设计和开发团队之间的差距。
Thymeleaf特点
- Thymeleaf在有网络和无网络的环境下均可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持HTML原型,然后再HTML标签里增加额外的属性来达到模版+数据的展示方式。浏览器解释HTML是会忽略未定义的标签属性,所以Thymeleaf的模版可以静态地运行;当有数据返回到页面是,Thymeleaf会动态地替换掉静态内容,使页面动态显示
- Thymeleaf开箱即用的特性。它支持标准方言和Spring方言,可以直接套用模版实现JSTL、OGNL表达式效果,避免每天套模板、改JSTL、改标签的困扰。同时开发人员也可以扩展和创建自定义的方言
- Thymeleaf提供Spring标准方言和一个与SpringMVC完美集成的可选模块,可以快速地实现表单绑定、属性编辑器、国际化等功能
添加依赖(启动器)
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
application.properties添加配置
springthymeleaf.cache=false
spring.thymeleaf.cache=false 是关闭Thymeleaf的缓存,不然在开发环境中修改页面不会立刻生效需要重启,生产可配置为true
Model准备(参考SpringBoot:Web开发(基于SpringBoot使用MyBatis-Plus+JSP开发)中使用MyBatisX快捷生成)
实体类
package com.ktjiaoyu.thymeleaf.entity;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import java.io.Serializable;
import lombok.Data;
/**
*
* @TableName sys_user
*/
@TableName(value ="sys_user")
@Data
public class User implements Serializable {
/**
* 编号
*/
@TableId(type = IdType.AUTO)
private Long usrId;
/**
* 姓名
*/
private String usrName;
/**
* 密码
*/
private String usrPassword;
/**
* 角色编号
*/
private Long usrRoleId;
// private String roleName;
/**
* 状态
*/
private Integer usrFlag;
@TableField(exist = false)
private static final long serialVersionUID = 1L;
@Override
public boolean equals(Object that) {
if (this == that) {
return true;
}
if (that == null) {
return false;
}
if (getClass() != that.getClass()) {
return false;
}
User other = (User) that;
return (this.getUsrId() == null ? other.getUsrId() == null : this.getUsrId().equals(other.getUsrId()))
&& (this.getUsrName() == null ? other.getUsrName() == null : this.getUsrName().equals(other.getUsrName()))
&& (this.getUsrPassword() == null ? other.getUsrPassword() == null : this.getUsrPassword().equals(other.getUsrPassword()))
&& (this.getUsrRoleId() == null ? other.getUsrRoleId() == null : this.getUsrRoleId().equals(other.getUsrRoleId()))
&& (this.getUsrFlag() == null ? other.getUsrFlag() == null : this.getUsrFlag().equals(other.getUsrFlag()));
}
@Override
public int hashCode() {
final int prime = 31;
int result = 1;
result = prime * result + ((getUsrId() == null) ? 0 : getUsrId().hashCode());
result = prime * result + ((getUsrName() == null) ? 0 : getUsrName().hashCode());
result = prime * result + ((getUsrPassword() == null) ? 0 : getUsrPassword().hashCode());
result = prime * result + ((getUsrRoleId() == null) ? 0 : getUsrRoleId().hashCode());
result = prime * result + ((getUsrFlag() == null) ? 0 : getUsrFlag().hashCode());
return result;
}
@Override
public String toString() {
StringBuilder sb = new StringBuilder();
sb.append(getClass().getSimpleName());
sb.append(" [");
sb.append("Hash = ").append(hashCode());
sb.append(", usrId=").append(usrId);
sb.append(", usrName=").append(usrName);
sb.append(", usrPassword=").append(usrPassword);
sb.append(", usrRoleId=").append(usrRoleId);
sb.append(", usrFlag=").append(usrFlag);
sb.append(", serialVersionUID=").append(serialVersionUID);
sb.append("]");
return sb.toString();
}
}
数据访问层
package com.ktjiaoyu.thymeleaf.mapper;
import com.ktjiaoyu.thymeleaf.entity.User;
import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import org.apache.ibatis.annotations.Param;
import org.springframework.web.bind.annotation.PathVariable;
import java.util.List;
/**
* @author Administrator
* @description 针对表【sys_user】的数据库操作Mapper
* @createDate 2024-09-09 09:10:40
* @Entity com.ktjiaoyu.thymeleaf.entity.User
*/
public interface UserMapper extends BaseMapper<User> {
}
业务逻辑层
接口
package com.ktjiaoyu.thymeleaf.service;
import com.ktjiaoyu.thymeleaf.entity.User;
import com.baomidou.mybatisplus.extension.service.IService;
import java.util.List;
/**
* @author Administrator
* @description 针对表【sys_user】的数据库操作Service
* @createDate 2024-09-09 09:10:40
*/
public interface UserService extends IService<User> {
}
实现类
package com.ktjiaoyu.thymeleaf.service.impl;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
import com.ktjiaoyu.thymeleaf.entity.User;
import com.ktjiaoyu.thymeleaf.service.UserService;
import com.ktjiaoyu.thymeleaf.mapper.UserMapper;
import jakarta.annotation.Resource;
import org.apache.ibatis.annotations.Param;
import org.springframework.stereotype.Service;
import java.util.List;
/**
* @author Administrator
* @description 针对表【sys_user】的数据库操作Service实现
* @createDate 2024-09-09 09:10:40
*/
@Service
public class UserServiceImpl extends ServiceImpl<UserMapper, User>
implements UserService{
}
控制器开发
package com.ktjiaoyu.thymeleaf.controller;
import com.ktjiaoyu.thymeleaf.entity.User;
import com.ktjiaoyu.thymeleaf.service.UserService;
import jakarta.annotation.Resource;
import jakarta.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import java.util.Date;
import java.util.List;
/**
* @author cuishujian
* @date 2024/9/13
*/
//@Controller
public class ExampleController {
@Resource
private UserService userService;
@GetMapping("/hello/{id}")
public String getUser(@PathVariable("id") Long usrId, Model model){
User user = userService.getUser(usrId);
model.addAttribute("user",user);
return "demo/hello";
}
}
页面开发
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Hello</title>
</head>
<body>
欢迎您,<span th:text="${user.usrName}">usrName</span>!
</body>
</html>
效果图
Thymeleaf的常用标签及其用法:
1. 数据绑定与文本替换
-
th:text:用于替换标签体内的文本内容。
<span th:text="${user.name}">用户名</span>
-
th:utext:与
th:text
类似,但会处理HTML标签。<p th:utext="${htmlContent}">这里会展示HTML内容</p>
2. 条件判断
-
th:if:用于条件判断,如果条件为真,则显示标签体内容。
<span th:if="${user.admin}">管理员</span>
-
th:unless:与
th:if
相反,条件为假时显示标签体内容。<a th:href="@{/login}" th:unless="${session.user != null}">Login</a>
3. 循环遍历
- th:each:用于遍历集合、数组或Map等。
<ul>
<li th:each="user : ${userList}" th:text="${user.name}"></li>
</ul>
4. URL与链接
-
th:href:用于构建URL。
<a th:href="@{/user/{id}(id=${user.id})}">查看用户</a>
-
th:action:用于表单的提交地址。
<form th:action="@{/submit}"> ... </form>
5. 样式与属性
-
th:style:用于设置标签的style属性。
<div th:style="'background-color: ' + ${bgColor} + ';'">...</div>
-
th:attr:用于设置标签的任意属性。
<img th:attr="src=@{/images/logo.png},alt=${altText}" />
6. 布局与片段
-
th:fragment:定义一个可以复用的片段(Fragment)。
<div th:fragment="header">页眉内容</div>
-
th:include 和 th:replace:用于引入其他模板文件中的片段。
<!-- 引入片段,但保留自己的标签 --> <div th:include="header :: header"></div> <!-- 替换整个标签为引入的片段 --> <div th:replace="footer :: footer"></div>
7. 表达式与内置对象
Thymeleaf支持多种表达式,包括选择变量表达式${...}
、选择表达式*{...}
、消息表达式#{...}
等。此外,它还提供了许多内置对象,如#strings
、#numbers
、#dates
等,用于执行字符串、数字、日期等的操作。
8. 其他常用标签
- th:id:用于替换HTML元素的id属性。
- th:value:用于设置表单元素的value属性。
- th:selected:用于设置下拉框(
<select>
)中选中的项。 - th:checked:用于设置复选框(
<input type="checkbox">
)或单选按钮(<input type="radio">
)的选中状态。 - th:switch 和 th:case:用于多路选择,类似于Java中的
switch
语句。
Thymeleaf的标签库非常丰富,上述只是其中的一部分常用标签。在实际开发中,可以根据项目需求选择合适的标签来简化页面开发。
表达式
1. 变量表达式
- 语法:
${...}
- 用途:用于在模板中输出变量的值。
- 示例:
<h1 th:text="${pageTitle}">Page Title</h1>
2. 选择变量表达式
- 语法:
*{...}
- 用途:用于从选定对象中选择属性或调用方法,类似于JSP中的EL表达式。
- 示例:
<p th:text="*{user.name}">Default Name</p>
3. 消息表达式
- 语法:
#{...}
- 用途:用于获取国际化内容,根据当前环境选择合适的文本。
- 示例:
<span th:text="#{welcome.message}">Welcome!</span>
4. 链接URL表达式
- 语法:
@{...}
- 用途:用于生成链接或动态URL,支持相对路径和绝对路径。
- 示例:
- 绝对URL:
<a th:href="@{http://www.thymeleaf.org}">Thymeleaf</a>
- 相对URL:
<a th:href="@{/product/{id}(id=1)}">Product Details</a>
- 绝对URL:
5. 字面量
- 文本:
'one text', 'another one!'
- 数值:
0, 34, 3.0, 12.3
- 布尔类型:
true, false
- 空值:
null
6. 文本操作
- 字符串连接:使用
+
操作符。 - 示例:
<span th:text="'Welcome to our application, ' + ${user.name} + '!'">
7. 算术运算
- 支持的运算符:
+, -, *, /, %
- 示例:
<p th:text="${number1} + ${number2}"></p>
8. 布尔操作
- 支持的运算符:
and, or
- 非操作符:
!, not
9. 关系操作符
- 比较运算符:
>, <, >=, <=
(HTML中转义为gt, lt, ge, le
) - 相等运算符:
==, !=
(或eq, ne
)
10. 条件表达式
- If-then:
(if) ?(then)
- If-then-else:
(if) ?(then) : (else)
- 示例:
<tr th:class="${row.even}?'even':'odd'"></tr>
原文地址:https://blog.csdn.net/cuishujian_2003/article/details/142396816
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!