文章目录
1.Thymeleaf 简介
Thymeleaf是一个Java XML / XHTML / HTML5 模板引擎 ,可以在Web(基于servlet )和非Web环境中工作。 它更适合在基于MVC的Web应用程序的视图层提供XHTML / HTML5,但它甚至可以在脱机环境中处理任何XML文件。 它提供完整的Spring Framework。
在Web应用程序中,Thymeleaf旨在成为JavaServer Pages (JSP)的完全替代品,并实现自然模板的概念:模板文件可以直接在浏览器中打开,并且仍然可以正确显示为网页。
Thymeleaf是开源软件、许可下 Apache许可证2.0.
2. 快速创建Thymeleaf项目
1.先创建spring boot项目
2.勾选Spring web常见web工程,和模板引擎中的Thymeleaf。
3.idea自动将Thymeleaf的相关以来导入pom.xml文件中
Thymeleaf项目的创建完成!
3. Thymeleaf表达式
标准环境表达式和选择变量表达式
1.首先创建实体类(id,username,age)以及getter和setter方法
2.创建控制类,user对象,并为user对象赋值传给userDetail页面
3.编写html页面
4.访问后的界面
路径表达式(不带参)
1.编写控制类
2.编写html界面
3.访问界面后
上面内容结束,注意事项如下:
路径表达式(带参)
单个参数
1.单个参数(采用拼接字符串形式),同时也可以用另一种方式,下面有介绍
2.控制类的方法
3.结果界面
后台获取多个参数
控制类界面
url.html界面
所用到的代码
1.controller类
package com.springboot_thymeleaf;
import com.springboot_thymeleaf.model.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;
@Controller
public class UserController {
@RequestMapping("/user/detail")
public ModelAndView userDetail(){
ModelAndView modelAndView=new ModelAndView();
User user=new User();
user.setId(1);
user.setUsername("liHua");
user.setAge(23);
modelAndView.setViewName("userDetail");
modelAndView.addObject("user",user);
return modelAndView;
}
@RequestMapping("/url")
public String urlExpression(Model model){
model.addAttribute("id",1001);
model.addAttribute("age",20);
model.addAttribute("username","zhaoliu");
return "url";
}
@RequestMapping(value = "test")
public @ResponseBody String test(String username){
return "请求路径/test,参数是:"+username;
}
@RequestMapping(value = "/test1")
@ResponseBody
public String test1(Integer id,String username,Integer age){
return "请求路径/test1,参数id:"+id+",username="+username+",age="+age;
}
}
2.userDetail.html
```java
```html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--推荐-->
<h2>标准环境表达式:${} </h2>
用户编号:<span th:text="${user.id}"></span><br>
用户姓名:<span th:text="${user.username}"></span><br>
用户年龄:<span th:text="${user.age}"></span><br>
<br>
<!--不推荐-->
<h2>选择变量表达式(星号表达式):*{}</h2>
<div th:object="${user}">
用户编号:<span th:text="*{id}"></span><br>
用户姓名:<span th:text="*{username}"></span><br>
用户年龄:<span th:text="*{age}"></span><br>
</div>
</body>
</html>
3.url.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>URL路径表达式</title>
</head>
<body>
<h1>URL路径表达式:@{...}</h1>
<h2>a标签中的绝对路径(没有参数)</h2>
<a href="http://www.baidu.com">传统写法:跳转至百度</a><br>
<a th:href="@{http://www.baidu.com}">路径表达式:跳转到百度</a><br>
<a th:href="@{http://localhost:8080/user/detail}">跳到/user/detail</a>
<br>
<h2>URL路径表达式,相对路径(没有参数)</h2>
<a th:href="@{/user/detail}">跳转到:/user/detail</a><br>
<h2>URL绝对路径(带参)</h2>
<a th:href="@{http://localhost:8080/test?username='zhangsan'}">绝对路径,带参数/test,并带参数username</a>
<h2>URL相对路径</h2>
<a th:href="@{/test?username='lisi'}">相对路径,带参数/test,并带参数username</a>
<h2>相对路径(带参数:后台获取的参数值)</h2>
<a th:href="@{'/test?username='+${id}}">相对路径:获取后台参数值</a>
<h2>相对路径(带参数:后台获取的多个参数值)</h2>
<a th:href="@{'/test1?id='+${id}+'&username='+${username}+'&age='+${age}}">相对路径:获取后台参数值</a><br>
<a th:href="@{/test1(id=${id},username=${username},age=${age})}">第二种相对路径:获取后台参数值</a>
</body>
</html>```