【翠花学SpringBoot】使用Springboot进行页面操作（thymeleaf）

Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。它与JSP，Velocity，FreeMaker 等模板引擎类似，也可以轻易地与 Spring MVC 等 Web 框架集成。与其它模板引擎相比，Thymeleaf 最大的特点是，即使不启动 Web 应用，也可以直接在浏览器中打开并正确显示模板页面 。

演练：

通过使用thymeleaf模板进行增删改查。

创建项目。

注意勾选thymeleaf依赖，其余的和之前相同。

在pom文件中导入mybatis-plus依赖：

<dependency>
    <groupId>com.baomidou</groupId>
    <artifactId>mybatis-plus-boot-starter</artifactId>
    <version>3.5.1</version>
</dependency>

并把mysql版本号该为5.1.26。

以demo数据库的book表作实体类，在YAML文件中配置连接数据库的代码，并配置thymeleaf末班的前后缀以及是否开启缓存。

其余创建实体类，mapper接口，service接口，service实现类均匀之前相同，这里不再一一赘述。

查询

创建 controller控制器，路径保持根目录请求，根目录请求直接到控制器中所写的方法里，再通过这个方法将值传到指定的页面。

 在templates目录下创建html页面，进行数据的迭代。

使用thymeleaf模板需要引入命名空间。代码如下：

 xmlns:th="http://www.thymeleaf.org"

引完空间之后，需要注意：thymeleaf没有标签，必须写在标签的属性上。具体格式如下：

输入url路径查看页面

注意：以上报红的地方并不是代码错误，只是解析器的问题，如果看的不舒服可以通过在末尾alt+enter+右箭头,选择禁用检查，即可消除报红的波浪线。

增加

创建添加页面。

注意:thymeleaf不能进行页面之间的跳转，只能通过控制器去跳转到页面。

如下所示：即使我templates目录下存在add页面，但是通过在页面跳转到add页面显示的是404。

 

只有通过控制器才可以跳转到指定的页面。

在控制器中创建添加的方法。

这里需要注意的是：此时增加之后我想回到列表页面看我是否添加成功，但是如果直接回到index页面他返回的数据为空。这是因为我index页面的数据是通过控制器获取的，也就是说如果我想添加完之后查看列表需要先走控制器中的查看列表的方法。这时需要通过指示符来跳转。

回到index页面，添加弹框。

 这时进行添加操作，发现页面弹出400，数据类型发生错误。

这是因为日期转换错误，需要在实体类中找到日期属性，在其上方添加@DateTimeFormat注解，该注解会自动将请求中的字符串转换为指定格式的Date类型的数据。

 这时再次进行增加操作即可操作成功。

 修改

添加修改超链接，两种写法如下：

修改之前需要通过id获取对象，所以需要传id。

 在控制器中添加查询单个对象的方法，注意参数前加的注解，获取之后将值带到修改界面。

thymeleaf获取值是通过th:value格式获取，所以需要引入命名空间。

 

修改是通过id进行修改的，所以需要添加隐藏域获取id。

注意日期格式的转换。

 在控制器中添加修改方法，修改完之后跳转到列表页面。

在列表页面添加修改标记。

 打开页面进行测试。

 删除

在列表页面添加删除超链接。

在控制其中添加删除方法，删除之后回到列表页面。

 在列表页面添加删除标记。

打开网页进行操作。

 thymeleaf引入头部和尾部

通过以下固定的格式获取头部和尾部，如在项目中进行导入，需要注意头部和尾部页面的代码是否需要删减。

  thymeleaf获取session的值

在控制器中的查询列表方法里添加session对象，并通过session对象向页面中传用户名。

 在页面中通过如下格式获取通过session存的值。

 打开页面查看。