SpringBoot : Thymeleaf操作入门

最新推荐文章于 2022-09-12 13:40:13 发布

敲一个代码掉一根头发

最新推荐文章于 2022-09-12 13:40:13 发布

阅读量170

点赞数

本文链接：https://blog.csdn.net/AKA_1234/article/details/119180072

版权

Spring Boot 专栏收录该内容

4 篇文章 1 订阅

订阅专栏

Thymeleaf

1、模板引擎

前端交给我们的页面，是html页面。如果是我们以前开发，我们需要把他们转成jsp页面，jsp好处就是当我们查出一些数据转发到JSP页面以后，我们可以用jsp轻松实现数据的显示，及交互等。

jsp支持非常强大的功能，包括能写Java代码，但是呢，我们现在的这种情况，SpringBoot这个项目首先是以jar的方式，不是war，像第二，我们用的还是嵌入式的Tomcat，所以呢，他现在默认是不支持jsp的。

那不支持jsp，如果我们直接用纯静态页面的方式，那给我们开发会带来非常大的麻烦，那怎么办呢？

SpringBoot推荐你可以来使用模板引擎：

模板引擎，我们其实大家听到很多，其实jsp就是一个模板引擎，还有用的比较多的freemarker，包括SpringBoot给我们推荐的Thymeleaf，模板引擎有非常多，但再多的模板引擎，他们的思想都是一样的，什么样一个思想呢我们来看一下这张图：
在这里插入图片描述

模板引擎的作用就是我们来写一个页面模板，比如有些值呢，是动态的，我们写一些表达式。而这些值，从哪来呢，就是我们在后台封装一些数据。然后把这个模板和这个数据交给我们模板引擎，模板引擎按照我们这个数据帮你把这表达式解析、填充到我们指定的位置，然后把这个数据最终生成一个我们想要的内容给我们写出去，这就是我们这个模板引擎，不管是jsp还是其他模板引擎，都是这个思想。只不过呢，就是说不同模板引擎之间，他们可能这个语法有点不一样。其他的我就不介绍了，我主要来介绍一下SpringBoot给我们推荐的Thymeleaf模板引擎，这模板引擎呢，是一个高级语言的模板引擎，他的这个语法更简单。而且呢，功能更强大。

我们呢，就来看一下这个模板引擎，那既然要看这个模板引擎。首先，我们来看SpringBoot里边怎么用。

2、springboot中导入依赖

	<dependency>
		<groupId>org.thymeleaf</groupId>
		<artifactId>thymeleaf-spring5</artifactId>
	</dependency>
	<dependency>
		<groupId>org.thymeleaf.extras</groupId>
		<artifactId>thymeleaf-extras-java8time</artifactId>
	</dependency>
----------------------------------------------------------------------------------------
<!--thymeleaf-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

3、Thymeleaf分析

ThymeleafProperties中规定了默认的前缀和后缀

我们只需要把我们的html页面放在类路径下的templates下，thymeleaf就可以帮我们自动渲染了。

使用thymeleaf什么都不需要配置，只需要将他放在指定的文件夹下即可！

在这里插入图片描述

    public static final String DEFAULT_PREFIX = "classpath:/templates/";
    public static final String DEFAULT_SUFFIX = ".html";

3.1、thymeleaf语法

html页面中<html xmlns:th="http://www.thymeleaf.org">

所有Html元素都可以被Thymeleaf替换接管 th:元素名

3.2、thymeleaf常用命名空间

xmlns:th=http://www.thymeleaf.org
xmlns:sec=http://www.thymeleaf.org/extras/spring-security
xmlns:shiro=http://www.pollix.at/thymeleaf/shiro

3.3、thymeleaf官方文档PDF

thymeleaf官方文档PDF：https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html

在这里插入图片描述

首先，让我们看一下标准表达式特性的快速总结：

简单表达：
- 变量表达式：${...}
- 选择变量表达式：*{...}
- 讯息表达：#{...}
- 链接URL表达式：@{...}
- 片段表达：~{...}
文字
- 文本文字：'one text', 'Another one!',…
- 数字文字：0, 34, 3.0, 12.3,…
- 布尔文字：true, false
- NULL文字：null
- 文字标记：one, sometext, main,…
文本操作：
- 字符串级联：+
- 字面替换：|The name is ${name}|
算术运算：
- 二进制运算符：+, -, *, /, %
- 减号(一元运算符)：-
布尔运算：
- 二进制运算符：and, or
- 布尔否定(一元运算符)：!, not
比较和平等：
- 比较国：>, <, >=, <= (gt, lt, ge, le)
- 平等操作员：==, != (eq, ne)
条件运算符：
- 如果-然后：(if) ? (then)
- 如果-然后-否则：(if) ? (then) : (else)
- 违约：(value) ?: (defaultvalue)
特殊令牌：
- 不-行动：_

3.4、简易的thymeleaf操作

例如：

你可以通过Model对象传值，在后端通过thymeleaf接受

@Controller
@RequestMapping("/test")
public class ThymeleafController{

    @RequestMapping("/thymeleafTest")
    public String thymleafTest(Model model){

        model.addAttribute("msg","用户密码输入错误！");

        List<Dog> dogList=new ArrayList<>();
        Dog dog=new Dog("哈士奇",5);
        Dog dog2=new Dog("柯基",3);

        model.addAttribute("dog",dog);

        dogList.add(dog);
        dogList.add(dog2);
        model.addAttribute("dogList",dogList);

        return "test";
    }
}

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>恭喜你进入到Test.html页面上来了</h1>
<hr>
<div th:text="${msg}"></div>
<hr>
<div th:utext="${msg}"></div>
<hr>
<div th:text="*{msg}"></div>
<hr>
<p><input type="text" /></p>
<hr>
<!-- 循环遍历-->
<table border="2">
    <tr>
        <th>姓名</th>
    </tr>
    <tr th:each="dogs:${dog}">
        <td th:text="${dogs}" ></td>
    </tr>
</table>
<hr>
<table border="2">
    <tr>
        <th>种类</th>
        <th>年龄</th>
    </tr>
    <tr th:each="dogs:${dogList}">
        <td th:text="${dogs.getName()}" ></td>
        <td th:text="${dogs.getAge()}" ></td>
    </tr>
</table>

</body>
</html>

成果图：

在这里插入图片描述

成果图：

[外链图片转存中…(img-fkqL1YfS-1627454914170)]

更多操作请参考thymeleaf官方文档

敲一个代码掉一根头发

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
SpringBoot : Thymeleaf操作入门

Thymeleaf1、模板引擎前端交给我们的页面，是html页面。如果是我们以前开发，我们需要把他们转成jsp页面，jsp好处就是当我们查出一些数据转发到JSP页面以后，我们可以用jsp轻松实现数据的显示，及交互等。jsp支持非常强大的功能，包括能写Java代码，但是呢，我们现在的这种情况，SpringBoot这个项目首先是以jar的方式，不是war，像第二，我们用的还是嵌入式的Tomcat，所以呢，他现在默认是不支持jsp的。那不支持jsp，如果我们直接用纯静态页面的方式，那给我们开发会带来非常大
复制链接

扫一扫