Spring Boot系列之整合Thymeleaf模板引擎

Thymeleaf简介

Thymeleaf是一种Java模板引擎。

Thymeleaf能够处理HTML,XML,JavaScript,CSS以及纯文本,类似于freemarker。语法优雅易懂、遵从web标准。

Thymeleaf的主要目标是提供一个优雅和高度可维护的创建模板的方式。 为了实现这一点,它建立在自然模板的概念之上,以不影响模板作为设计原型的方式将其逻辑注入到模板文件中。 这改善了设计沟通,弥合了前端设计和开发人员之间的理解偏差。即我们所说的前后端分离。

Thymeleaf使用

1,我们创建一个Spring Boot项目,然后pom文件添加相关jar包。


        
            org.springframework.boot
            spring-boot-starter
        

        
            org.springframework.boot
            spring-boot-starter-test
            test
        

        
            org.springframework.boot
            spring-boot-starter-web
        

        
            org.springframework.boot
            spring-boot-starter-thymeleaf
        
    

其中spring-boot-starter是Spring Boot项目的父级依赖,spring-boot-starter-test测试包,这俩一般在我们创建项目就会自动引入。

我们只需手动添加web项目相关的spring-boot-starter-web,以及thymeleaf模板的spring-boot-starter-thymeleaf即可。

2,创建一个Controller

 

package com.example.demothymeleaf.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

import javax.servlet.http.HttpServletRequest;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
public class DemoThymeleafController {

    @GetMapping("/demo")
    public String toDemo(HttpServletRequest request){
        List demoList = new ArrayList();
        for(int i = 0; i < 5; i++){
            Map demoMap = new HashMap<>();
            demoMap.put("name","张三" + i);
            demoMap.put("age","5"+i);
            demoList.add(demoMap);
        }
        request.setAttribute("demoList",demoList);
        return "demo";
    }
}

3,在src/main/resource目录下面,创建templates目录,再在下面创建demo.html页面。

     这里解释一下,Spring Boot里面没有我们web开发的WebContent(WebApp),在src/main/resources下面有两个文件夹static和templates ,没有的话我们可以自己创建,Spring Boot默认static中放静态页面,而templates中放动态页面,感兴趣的同学可以自己研究一下源码,这里不做过多描述。

   




    Demo
    
    
    
    
    
    
    



            
                
姓名 年龄

 

4,浏览器中输入http://localhost:8081/demo,即可看到效果。由于8080端口被占用了,所以在application.properties中修改了一下端口号。server.port=8081

Spring Boot系列之整合Thymeleaf模板引擎_第1张图片

总结,thymeleaf使用起来很简单,前后端耦合度大大的降低。这里介绍一下thymeleaf常用的语法。

 


            
                
                    
                    
                
            
 

 是Thymeleaf提供的唯一一个块级元素,其特殊性在于Thymeleaf模板引擎在处理的时候会删掉它本身,标签本身不显示,而保留其内容,个人认为这个标签很重要。例如,控制一段html是否显示时。

th:text主要用于替换文本的值。th:utext支持html文本替换,th:value属性赋值。

th:each主要用于循环遍历。

th:if判断满足条件,th:unless判断不满足条件。

th:href链接地址。

th:fragment 布局标签,常用于定义一个代码片段,方便其它地方引用

th:replace 布局标签,替换整个标签到引入的文件

。。。。

。。。

本示例完整代码-github

还有很多,想了解的可以去官网https://www.thymeleaf.org/了解一下。

你可能感兴趣的:(spring,boot,Thymeleaf)