本章内容使用templates模板引擎,以及使用springboot整合mybatis完成查询所有的操作
1、创建项目
一、准备表
SET FOREIGN_KEY_CHECKS=0;
-- ----------------------------
-- Table structure for `student`
-- ----------------------------
DROP TABLE IF EXISTS `student`;
CREATE TABLE `student` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`stuname` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`sex` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`birthday` date DEFAULT NULL,
`idcard` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`state` int(11) DEFAULT '0',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=12 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
-- ----------------------------
-- Records of student
-- ----------------------------
INSERT INTO `student` VALUES ('1', 'aaa', '男', '2003-01-02', '410725200301021316', '1');
INSERT INTO `student` VALUES ('2', 'niu', '女', '2005-07-02', '410725200507021325', '1');
INSERT INTO `student` VALUES ('3', 'bbb', '女', '2004-11-12', '410725200411121324', '0');
INSERT INTO `student` VALUES ('4', 'xuecheng', '男', '2005-10-02', '410725200510021313', '0');
INSERT INTO `student` VALUES ('7', 'aaa', '男', '2000-07-02', '410725200007021312', '1');
INSERT INTO `student` VALUES ('11', 'ccc', '女', '2008-06-02', '410725200806021321', '0');
二、项目结构
2、什么是templates模板引擎
前端交给我们的页面,是html页面。如果是我们以前开发,我们需要把他们转成jsp页面,jsp好处就是当我们查出一些数据转发到JSP页面以后,我们可以用jsp轻松实现数据的显示,及交互等。
jsp支持非常强大的功能,包括能写Java代码,但是呢,我们现在的这种情况,SpringBoot这个项目首先是以jar的方式,不是war,像第二,我们用的还是嵌入式的Tomcat,所以呢,他现在默认是不支持jsp的
那不支持jsp,如果我们直接用纯静态页面的方式,那给我们开发会带来非常大的麻烦,那怎么办呢?
模板引擎,我们其实大家听到很多,其实jsp就是一个模板引擎,但是springboot推荐我们使用templates,模板引擎的作用就是我们来写一个页面模板,比如有些值呢,是动态的,我们写一些表达式。而这些值,从哪来呢,就是我们在后台封装一些数据。然后把这个模板和这个数据交给我们模板引擎,模板引擎按照我们这个数据帮你把这表达式解析、填充到我们指定的位置,然后把这个数据最终生成一个我们想要的内容给我们写出去,这就是我们这个模板引擎,不管是jsp还是其他模板引擎,都是这个思想。
只不过呢,就是说不同模板引擎之间,他们可能这个语法有点不一样。其他的我就不介绍了,我主要来介绍一下SpringBoot给我们推荐的Thymeleaf模板引擎,这模板引擎呢,是一个高级语言的模板引擎,他的这个语法更简单。而且呢,功能更强大。
一、导入templates
怎么引入templates呢,对于springboot来说,什么事情不都是一个start的事情嘛,我们去在项目中引入一下
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
有一个问题,上个作品我们扒过源码,知道这个静态资源是没有templates这个包的,那这个包是用来干嘛呢?
其实我们导入的thymeleaf模板引擎帮我们默认配置了些东西,默认的配置是在哪个文件?答:在XXXProperties,那thymeleaf模板引擎的默认配置类就是ThymeleafProperties,双击shift全局查询
我们可以看见他默认是在templates下的,classpath是指resources下,如果我们要定义自己的文件夹,不想用templates下,我们可以使用springboot的核心配置文件,使用spring.thymeleaf来覆盖,一般是不需要该的,我们只需要把我们的html页面放在类路径下的templates下,thymeleaf就可以帮我们自动渲染了
@Controller
public class TestController {
@GetMapping("/test")
public String test(Model model){
//存入数据
model.addAttribute("msg","Hello,Thymeleaf");
//classpath:/templates/test.html
return "test";
}
}
二、测试
编写controller
@Controller
public class TestController {
@GetMapping("/test")
public String test(Model model){
//存入数据
model.addAttribute("msg","Hello,Thymeleaf");
//classpath:/templates/test.html
return "test";
}
}
我们的页面是存放在templates下的并且是以.html为后缀的
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>测试页面</h1>
<!--th:text就是将div中的内容设置为它指定的值,和Vue一样-->
<div th:text="${msg}"></div>
</body>
</html>
当前的xmlns:th="http://www.thymeleaf.org" 我们要使用thymeleaf,需要在html文件中导入命名空间的约束,方便提示。 如果想多了解可以去这个路径https://docs.jinkan.org/docs/jinja2/templates.html
注意:如果启动报错是因为我们引入了mysql连接的依赖,它需要指定数据库路径,我们可以先注释掉
简单的我们使用一下语法
@RequestMapping("/t2")
public String test2(Map<String,Object> map){
//存入数据
map.put("msg","<h1>Hello</h1>");
map.put("users", Arrays.asList("aaa","bbb"));
//classpath:/templates/test.html
return "test";
}
html
<!--th:text就是将div中的内容设置为它指定的值,和Vue一样-->
<div th:text="${msg}"></div>
<!--不转义-->
<div th:utext="${msg}"></div>
<!--遍历数据-->
<!--th:each每次遍历都会生成当前这个标签:官网#9-->
<h4 th:each="user :${users}" th:text="${user}"></h4>
<h4>
<!--行内写法:官网#12-->
<span th:each="user:${users}">[[${user}]]</span>
</h4>
3、查询所有
一、准备实体类
这里主要是用来接收查询到的参数,封装到这个实体类内,也可以作为接收前端接收过来的数据,封装到这个实体类
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Student {
private Integer id;
private String stuname; // 年龄
private String sex; // 性别
private String idcard; //身份证号
//DateTimeFormat 接收前端传入的这种格式的字符串会被转化成日期
@DateTimeFormat(pattern = "yyyy-MM-dd")
private Date birthday; //生日
private Integer state; //状态 0未删除,1删除
}
工具类
用来响应的结果统一,这不是一个约束,是一种习惯,因为很多开源项目,基本都会有一个工具类,专门,存放状态码,信息,以及数据
@AllArgsConstructor
@Data
@NoArgsConstructor
public class Result<T> {
private Integer code;//状态码
private String message;//错误信息
private T t; //数据
public Result<T> success(String msg,T t){
return new Result<T>(200,msg,t);
}
public Result<T> fail(String msg){
return new Result<T>(500,msg,null);
}
}
二、使用模板引擎编写项目
首先我们先需要启动之后进入templates下面的main页面,我们默认第一个页面是 /的所以这里我写的,/或者/main都可以进入main页面
这里我们先把该搭建的类先搭建上去,谁调用谁先自动装配一下
1、查询所有
mapper
service
这里调用的mapper的查询方法,最后返回成一个List集合,如果查询到并且他的个数是大于0的我们就把这个数据放入我们的工具类中,否则就返回查询失败,
注意:这里我调用了两个success方法,最后一个返回应该是fail方法,但是影响不大,只是多传了一个数据
controller
因为我们使用的是模板引擎,我们只将数据放入Model里面,跳转到main页面的时候就带着这个数据了,我们只需要遍历就行了
返回前台的数据格式是
页面搭建
这里我们使用的是模板引擎的循环,遍历出所有我们当时查询到的数据,
<table>
<tr>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>生日</th>
<th>身份证号</th>
<th>操作</th>
</tr>
<tbody>
<tr th:each="student:${students.t}">
<td th:text="${student.id}"></td>
<td th:text="${student.stuname}"></td>
……
</tr>
</tbody>
</table>