012-SpringBoot-Thymeleaf 的表达式

最新推荐文章于 2022-08-24 15:12:37 发布

AlluzeYu

最新推荐文章于 2022-08-24 15:12:37 发布

阅读量240

点赞数

分类专栏： SpringBoot 文章标签： java

本文链接：https://blog.csdn.net/allurelover/article/details/116738145

版权

SpringBoot 专栏收录该内容

14 篇文章 1 订阅

订阅专栏

1# 1.创建module

1.1 创建 SpringBoot 的 web 项目并使用模版引擎

1、创建module
018-springboot-thymeleaf-expression

引入web和模板引擎

创建完成后pom.xml文件中会有如下依赖坐标

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

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

1.2 在 application.properties 中设置 thymeleaf 参数

#配置关闭模板缓存
spring.thymeleaf.cache=false
#设置thymeleaf模板前缀
spring.thymeleaf.prefix=classpath:/templates/
#设置thymeleaf模板后缀
spring.thymeleaf.suffix=.html

1.3 创建实体类User

package com.zzy.springboot.pojo;


public class User {

    private Integer id;
    private String name;
    private String phone;
    private String address;

    public User() {
    }

    public User(Integer id, String name, String phone, String address) {
        this.id = id;
        this.name = name;
        this.phone = phone;
        this.address = address;
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getPhone() {
        return phone;
    }

    public void setPhone(String phone) {
        this.phone = phone;
    }

    public String getAddress() {
        return address;
    }

    public void setAddress(String address) {
        this.address = address;
    }

    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", name='" + name + '\'' +
                ", phone='" + phone + '\'' +
                ", address='" + address + '\'' +
                '}';
    }
}

1.4 创建ThymeleafController

package com.zzy.springboot.web;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class ThymeleafController {

    @RequestMapping(value = "/thymeleaf/index")
    public String index(Model model){
        model.addAttribute("data", "thymeleaf表达式");
        return "index";
    }
}

1.5 在 src/main/resources/templates 在创建 index.html 页面

引入thymeleaf的命名空间
注意：th:text="" 是 Thymeleaf 的一个属性，用于文本的显示

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <span th:text="${data}"></span>
</body>
</html>

1.6 运行访问

http://localhost:8018/thymeleaf/index

2.thymeleaf - 标准变量表达式

2.1 语法

${…}

2.2 说明

标准变量表达式用于访问容器（tomcat）上下文环境中的变量，功能和 EL 中的 ${} 相同。
Thymeleaf 中的变量表达式使用 ${变量名} 的方式获取 Controller 中 model 其中的数据

2.3 案例展示

创建一个方法，将用户信息存放到 model 中，thymeleaf 模版页面获取对象信息

2.3.1、在ThymeleafController中添加方法，向model放入user对象

    /**
     * model中存入对象
     * @param model
     * @return
     */
    @RequestMapping(value = "/thymeleaf/user")
    public String user(Model model){
        User user = new User();
        user.setId(1);
        user.setName("tom");
        user.setPhone("12333");
        user.setAddress("北京市东城区");
        model.addAttribute("user", user);
        return "user";
    }

2.3.2 templates下创建user.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>thymeleaf标准表达式：展示对象用户信息</title>
</head>
<body>
    <h1>展示用户信息</h1>
    用户编号：<span th:text="${user.id}"></span>
    用户姓名：<span th:text="${user.name}"></span>
    用户电话：<span th:text="${user.phone}"></span>
    用户地址：<span th:text="${user.address}"></span>
</body>
</html>

2.3.3 浏览器访问测试

http://localhost:8018/thymeleaf/user

3. thymeleaf - 选择变量表达式

3.1 语法

*{…}

3.2 说明

选择变量表达式，也叫星号变量表达式，使用 th:object 属性来绑定对象
选择表达式首先使用 th:object 来绑定后台传来的 User 对象，然后使用 * 来代表这个对象，后面 {} 中的值是此对象中的属性。
选择变量表达式 *{…} 是另一种类似于标准变量表达式 $ {…} 表示变量的方法
选择变量表达式在执行时是在选择的对象上求解，而${…}是在上下文的变量 Model 上求解，这种写法比标准变量表达式繁琐

3.3 案例展示

3.3.1 在 user.html 通过选择变量表达式（星号表达式）获取用户数据

展示 User 用户信息

 <h1>展示用户信息：thymeleaf选择变量表达式</h1>
    <h2>>展示 User 用户信息（星号表达式,仅在 div 范围内有效）：</h2>
    <div th:object="${user}">
        用户编号：<span th:text="*{id}"></span><br>
        用户姓名：<span th:text="*{name}"></span><br>
        用户电话：<span th:text="*{phone}"></span><br>
        用户地址：<span th:text="*{address}"></span><br>
    </div>

3.3.3 运行访问

http://localhost:8018/thymeleaf/user

4. thymeleaf 标准变量表达式和选择变量表达式混合使用

在 user.html 通过标准变量表达式和选择变量表达式获取用户数据

<h1>展示用户信息：thymeleaf标准变量表达式和选择变量表达式混合使用</h1>
    用户编号：*{user.id} ==> <span th:text="*{user.id}"></span><br/>
    用户姓名：*｛user.name｝ ==> <span th:text="*{user.name}"></span><br/>
    用户手机号：*{user.phone} ==> <span th:text="*{user.phone}"></span><br/>
    用户地址：*{user.address} ==> <span th:text="*{user.address}"></span><br/>

5.thymeleaf - URL表达式

5.1 语法：

@{…}

5.2 说明

主要用于链接、地址的展示，用于在URL路径中动态获取数据，主要用于如下标签
< script src="…">、
< link href="…">、
< a href="…">、
< form action="…">、
< img src="">

5.3 案例展示

5.3.1 创建module

019-springboot-thymeleaf-urlexpression

5.3.2 编辑核心配置文件


#\u8BBE\u7F6Etomcat\u5185\u5D4C\u7AEF\u53E3\u53F7
server.port=8019

#\u914D\u7F6E\u5173\u95ED\u6A21\u677F\u7F13\u5B58
spring.thymeleaf.cache=false
#\u8BBE\u7F6Ethymeleaf\u6A21\u677F\u524D\u7F00
spring.thymeleaf.prefix=classpath:/templates/
#\u8BBE\u7F6Ethymeleaf\u6A21\u677F\u540E\u7F00
spring.thymeleaf.suffix=.html

5.3.3 编写pojo

package com.zzy.springboot.pojo;

public class User {
    private Integer id;
    private String username;

    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", username='" + username + '\'' +
                '}';
    }

    public User() {
    }

    public User(Integer id, String username) {
        this.id = id;
        this.username = username;
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }
}

5.3.4 编写Controller

package com.zzy.springboot.web;

import com.zzy.springboot.pojo.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

@Controller
public class UrlThymeleafController {

    /*标准表达式获取mv中的数据*/
    @RequestMapping("/user/index")
    public ModelAndView mv(){
        ModelAndView mv = new ModelAndView();
        User user = new User();
        user.setId(110);
        user.setUsername("哈里斯");
        mv.addObject("user", user);
        mv.setViewName("user");
        return mv;
    }


    /*路径表达式@{...}*/
    @RequestMapping("/user/url01")
    public String urlExpression(Model model){
        model.addAttribute("id", 111);
        model.addAttribute("username", "沙梅特");
        return "url01";
    }

    /*路径表达式@{...}参数拼接*/
    @RequestMapping("/user/args")
    @ResponseBody
    public Object args(Integer id,String username){
        return "用户的编号是:"+id+"用户的姓名是："+username;
    }

    /*路径表达式：restful风格*/
    @RequestMapping("/user/restful1/{username}")
    @ResponseBody
    public Object festful1(@PathVariable String username){
        return "用户的姓名是："+username;
    }

    @RequestMapping("/user/restful2/{id}/{username}")
    @ResponseBody
    public Object festful2(@PathVariable Integer id,
                           @PathVariable String username){
        return "用户的编号是:"+id+"用户的姓名是："+username;
    }

}

5.3.5 编写user.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>标准变量表达式${...}获取mv中的数据</h1>
    用户编号：<span th:text="${user.id}"></span><br>
    用户名称：<span th:text="${user.username}"></span>
</body>
</html>

5.3.6 编写url01.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
<body>
    <h1>传统方式</h1>
    <a href="http://www.baidu.com">跳转到百度主页面</a>
    <a href="http://localhost:8019/user/index">传统方式：跳转到user页面</a>

    <h1>路径表达式</h1>
    <a th:href="@{http://www.baidu.com}">路径表达式：跳转到百度主页面</a>
    <a th:href="@{http://localhost:8019/user/index}">路径表达式：跳转到user页面</a>

    <h1>路径表达式-相对路径（开发常用）</h1>
    <a th:href="@{/user/index}">相对路径：跳转到:/user/index的user页面</a>

    <h1>路径表达式：参数的拼接</h1>
    <a th:href="@{/user/args?id=112&username=tom}">路径表达式：？号拼接参数</a>

    <h1>路劲表达式：获取后台数据当做参数</h1>
    <a th:href="@{'/user/args?id='+${id}+'&username='+${username}}">后台数据，？号拼接当做参数</a><br>
    <a th:href="@{/user/args(id=${id},username=${username})}">后台数据，对象当做参数</a><br>

    <h1>路径表达式：获取后台数据当做restFul风格参数传递</h1>
    <a th:href="@{'/user/restful1/'+${username}}">restful单个参数传递</a><br>
    <a th:href="@{'/user/restful2/'+${id}+'/'+${username}}">restful多个参数传递</a><br>
</body>
</html>

5.3.7 运行访问

运行

访问路径
http://localhost:8019/user/url01

检察院诉查看

AlluzeYu

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
012-SpringBoot-Thymeleaf 的表达式

1.创建module1.1 创建 SpringBoot 的 web 项目并使用模版引擎1、创建module018-springboot-thymeleaf-expression引入web和模板引擎创建完成后pom.xml文件中会有如下依赖坐标 <dependency> <groupId>org.springframework.boot</groupId> <artifactId&g
复制链接

扫一扫

专栏目录