Thymeleaf模板引擎

最新推荐文章于 2024-03-08 17:49:08 发布

想要飞翔的小乌龟

最新推荐文章于 2024-03-08 17:49:08 发布

阅读量140

点赞数

分类专栏： Spring Boot 文章标签： Thymeleaf

本文链接：https://blog.csdn.net/qq_41199502/article/details/115057147

版权

Spring Boot 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

一、什么是模板引擎？

在这里插入图片描述

Template（模板）中有一些动态的表达式，Data（数据区）中有从后端获取的值，TemplateEngine(模板引擎)将Template和Data进行整合，将Data中的数据填充到Template中的动态表达式中，然后生成一个我们想要的内容（output）。不管是Thymeleaf、jsp还是其他模板引擎，都是这样的思想，只是语法不一样。

Spring boot推荐的Thymeleaf; 语法简单，功能更强大。

二、引入Thymeleaf

1.导入启动器

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

SpringBoot会自动为Thymeleaf注册一个视图解析器：ThymeleafViewResolver
与解析JSP的InternalViewResolver类似，Thymeleaf也会根据前缀和后缀来确定模板文件的位置：
在这里插入图片描述
默认前缀：classpath:/templates/
默认后缀：.html

2.简单样例

如果我们在controller类中返回一个"hello",视图解析器会自动将访问路径进行拼接,拼接为：classpath:/templates/hello.html

在这里插入图片描述

Controler 层：


    @RequestMapping("/hello")
    public  String hello(){
        return "hello";
    }

静态页面

上面我们已经学习到Thymeleaf是一个基于html的模板引擎，但是我们还是需要加入特定标签来声明和使用Thymeleaf的语法。我们需要在Thymeleaf的头部加Thymeleaf标识

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

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>你好</h3>
</body>
</html>

结果

在这里插入图片描述

3.thymeleaf语法

- ${}表达

通过${…}进行取值

-自定义对象、list、map取值方法

package com.example.springboot_mst1.controller;

import com.example.springboot_mst1.pojo.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

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

@Controller
public class HelloController {

    @RequestMapping("/hello")
    public  String hello(){

        return "hello";
    }

    @RequestMapping("/success")
    public String success(Model model){

        String name="殷会东";

        User user1=new User("殷",21,true);
        User user2=new User("拉拉",21,true);
        
        List<String> list=new ArrayList<>();
        list.add("aaaa");
        list.add("bbbb");
        list.add("cccc");

        Map<String,User> map=new HashMap<>();
        map.put("yin",user1);
        map.put("lala",user2);


        model.addAttribute("name",name);
        model.addAttribute("user1",user1);
        model.addAttribute("list",list);
        model.addAttribute("map",map);


        return "success";
    }


}

<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<h2>普通字符串</h2>
<div th:text="${name}"></div>


<h2>JavaBean对象</h2>
<table bgcolor="#ffe4c4" border="1">
    <tr>
        <td>介绍</td>
        <td th:text="${user1.name}"></td>
    </tr>
    <tr>
        <td>年龄</td>
        <td th:text="${user1['age']}"></td>
    </tr>
    <tr>
        <td>介绍</td>
        <td th:text="${user1.isSex()}"></td>
    </tr>
</table>

<h2>javaList遍历取值</h2>
<table  bgcolor="aqua" border="1">
    <tr th:each="item:${list}">
     <td th:text="${item}"></td>
    </tr>
</table>

<h2>javaMap遍历</h2>
<table bgcolor="#7fffd4" border="1">
    <tr th:each="item:${map}">
        <td th:text="${item.key}"></td>
        <td th:text="${item.value}"></td>
        <td th:text="${item.value.getName()}"></td> 取某个对象中的元素
    </tr>
</table>

<table bgcolor="#7fffd4" border="1">
    <tr>
        <td>名字</td>
        <td th:text="${map.get('yin')}"></td>
        <td th:text="${map.get('yin').getName()}"></td> 取某个对象中的元素
    </tr>
</table>

</body>
</html>