欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

SpringBoot之模板引擎

程序员文章站 2024-03-12 15:07:26
...

SpringBoot之模板引擎

模板引擎简介

  • 模板引擎作用
    SpringBoot之模板引擎

  • 市面上的模板引擎有：JSP、Velocity、Freemarker、Thymeleaf；

  • 之前开发用jsp当摸吧引擎，但是springboot的特殊机制，使得springboot不支持jsp页面，但这样会有很多开发上的不方便，所以他支持了Thymelead模板引擎。

Thymeleaf语法

  • 特点：相比jsp，他语法更简单，功能更加强大。

  • 引入thymeleaf

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

  • 语法

    • 只要我们把HTML页面放在classpath:/templates/目录下，thymeleaf就能自动帮我们渲染页面。

      • 例如

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

      • 目录结构
        SpringBoot之模板引擎

    • 为页面加入语法提示,引入命名空间

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

    • 使用thymeleaf语法

      • 后端

            @RequestMapping("/success")
    public String success(Map<String,String> map){
        map.put("hello","你好");
        return "success";
    }

      • 将容器中文本内容设置为指定的内容——th:text

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

        这样好处是，如果div里面原本有文本，不经过thymeleaf渲染的话，就显示原本内容，thymeleaf文本不影响

    • 语法规则

      • th：text：改变当前元素里面的文本内容

      • th:任意html属性：来替换原声html里面属性的值

      • 一些较为复杂语法
        SpringBoot之模板引擎

      • 表达式

        1. 获取对象属性、调用方法

        2. 使用内置的基本对象

        3. 内置工具对象

          详情参考usingthymeleaf手册

          *{}和${}在功能上一致，只是有一个补充的功能，配合th:object使用

        4. '#{}'是用来获取国际化内容的

        5. @{}是用来定义url链接的

          <!-- Will produce 'http://localhost:8080/gtvg/order/details?orderId=3' (plus rewriting) -->
<a href="details.html"
th:href="@{http://localhost:8080/gtvg/order/details(orderId=${o.id})}">view</a>

          • 如果是多个参数的话

            @{/order/process(execId=${execId},execType='FAST')}

    ​ 支持数学运算、布尔运算、比较运算、

    示例

    • 代码

      • 后端

        package com.example.springbootdemo.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.Arrays;
import java.util.Map;
@Controller
public class DemoController {

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

    @RequestMapping("/success")
    public String success(Map<String,Object> map){
        map.put("hello","<h1>你好</h1>");
        map.put("users", Arrays.asList("zhangsan","lisi","wangwu"));
        return "success";
    }
}

      • 前端

        <!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>
<div th:text="${hello}"></div>
<div th:utext="${hello}"></div>
<!--遍历数组-->
<!--th:each每次遍历都会生成一个当前这个标签-->
<h4 th:text="${user}" th:each="user:${users}"></h4>
<hr>
<!--[]转义特殊字符-->
<h4>
    <span th:each="user:${users}">[[${user}]]</span>
</h4>
</body>
</html>

      • 效果
        SpringBoot之模板引擎

        • 查看生成源代码

          <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>成功访问!</h1>
<div>&lt;h1&gt;你好&lt;/h1&gt;</div>
<div>&lt;h1&gt;你好&lt;/h1&gt;</div>
<div><h1>你好</h1></div>
<!--遍历数组-->
<!--th:each每次遍历都会生成一个当前这个标签-->
<h4>zhangsan</h4>
<h4>lisi</h4>
<h4>wangwu</h4>
<hr>
<!--[]转义特殊字符-->
<h4>
    <span>zhangsan</span><span>lisi</span><span>wangwu</span>
</h4>
</body>
</html>

上一篇： Java 日期转换详解及实例代码

下一篇： 华为eNSP实验：VRRP协议双组双备实验

推荐阅读