【学习笔记】SpringBoot之Thymeleaf(一)

最新推荐文章于 2024-05-02 20:52:57 发布

苯基乙胺

最新推荐文章于 2024-05-02 20:52:57 发布

阅读量254

点赞数

分类专栏： Java 文章标签： SpringBoot Thymeleaf Java

本文链接：https://blog.csdn.net/weixin_40808835/article/details/82710070

版权

Java 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

配置Thymeleaf

1. 需要在poom文件中引入一个依赖,自动加入Jar包

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

如果需要更改版本信息,可以去查看一下官方文档,需要加入一个Start和一个Layout,Layout和Thymeleaf

        <properties>
            <thymeleaf.version>3.0.9.RELEASE</thymeleaf.version>
            <!--Layout的版本不必须要和上面的Thymeleaf版本一致-->
             <thymeleaf‐layout‐dialect.version>2.2.2</thymeleaf‐layout‐dialect.version>
         </properties>

Thymeleaf语法

##### 先来看看Thymeleaf的内部一些文件

@ConfigurationProperties(prefix="spring.thymeleaf")
 publicclassThymeleafProperties{

 private static final Charset DEFAULT_ENCODING = Charset.forName("UTF‐8"); 5
 private static final MimeType DEFAULT_CONTENT_TYPE = MimeType.valueOf("text/html"); 7
 public static final String DEFAULT_PREFIX = "classpath:/templates/";

 public static final String DEFAULT_SUFFIX = ".html";
 //

只要我们把HTML页面放在classpath:/templates/，thymeleaf就能自动渲染

1.导入一下Thymeleaf的命名空间可以让你在Html中有代码提示

<htmllang="en"xmlns:th="http://www.thymeleaf.org">

2.Thymeleaf的语法规则

只能在标签页面里面加入 th:XXX

-
Thymeleaf语法

3.Thymeleaf表达式都有什么

 Simpleexpressions:(表达式语法)
    Variable Expressions: ${...}:获取变量值;OGNL;
    1)、获取对象的属性、调用方法 
    2)、使用内置的基本对象:
          #ctx : the context object.
          #vars: the context variables.
          #locale : the context locale.
          #request : (only in Web Contexts) the HttpServletRequest object.
          #response : (only in Web Contexts) the HttpServletResponse object.
          #session : (only in Web Contexts) the HttpSession object.
          #servletContext : (only in Web Contexts) the ServletContexobject.


Selection Variable Expressions: *{...}:选择表达式:和${}在功能上是一样;
补充:配合 th:object="${session.user}:
   <div th:object="${session.user}">
    <p>Name: <span th:text="*{firstName}">Sebastian</span>.</p>
    <p>Surname: <span th:text="*{lastName}">Pepper</span>.</p>
    <p>Nationality: <span th:text="*{nationality}">Saturn</span>.</p>
    </div>
Message Expressions: #{...}:获取国际化内容 


Link URL Expressions: @{...}:定义URL;
@{/order/process(execId=${execId},execType='FAST')} 
<!--中间的execid 相当于之前我们要用到的 ?一样-->

Fragment Expressions: <!-- ~{...}:片段引用表达式-->
            <div th:insert="~{commons :: main}">...</div>

简单的小测试

首先按照语法规则,我们在templates目录下面创建一个html文件,我们先给它命名为success,然后引入Thymeleaf的语法标记库
- 然后在路径下面创建一个Controller,起一个名字,HelloController,然后在这个Java类里面,写入一个Map,用来给Success传值,一会显示出这些数据

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.Map;

@Controller
public class HelloController {


    @RequestMapping("/success")   //一会要访问映射地址
    //classpath:templates/success
    public String success(Map<String,Object> map){
        map.put("hello","<h1>你好<h1>");
        map.put("usr", Arrays.asList("zhangsna","lisi","wanger"));
        return "success";   //页面的地址
    }
}

应该能感觉到SpringBoot的强大,不需要繁琐的东西,直接就能找到我们需要的页面
1. 继续返回刚刚的页面,我们现在可以试试我们刚刚学到的一些语法规则
  - 首先来试试最简单的一个 ,这里需要注意一下标记库里面有一个是这个是不会转义,第一种是会转义的,也就是会不会识别特殊的一些转义符号在html当中
```
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
     <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>成功！</h1>

<div th:text="${hello}">

</div>
</br>

<div th:utext="${hello}">
</div>
</br>
</body>
</html>
```
  - ok 这样的话实际只是拿出来了我们在Controller中的一组数据,中间用分割线分开一下,看看转义和不转义的效果是什么样的…然后那我们来试试用遍历拿出List里面的数据.
```
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
     <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>成功！</h1>

<div th:text="${hello}"/>
 </br>

<div th:utext="${hello}">
</div>
</br>
    <h2>
        <span th:each="usr:${usr}">[[${usr}]]</br></span>
    </h2>
</div>
</body>
</html>
```
  - 这样的话我们就能遍历出list里面的数据,但是注意一点,[[]]这个的含义实际是th:text 没有写在span标签里面,如果用[{}]表示的是utext,而且这样遍历的花会显示3个span,如果th:each卸载了h2里面就会有3个h2 这一点需要注意