深入实践Spring Boot3.1　模型设计

3.3 使用Thymeleaf模板 完成了模型和控制器的设计之后,接下来的工作就是视图设计了.在视图设计中主要使用Thymeleaf模板来实现.在进行视图设计之前,先了解一下Thymeleaf模板的功能. Thymeleaf是一个优秀的面向Java的XML/XHTML/HTML 5页面模板,并具有丰富的标签语言和函数.使用Spring Boot框架进行界面设计,一般都会选择Thymeleaf模板.

3.3.1 Thymeleaf配置 要使用Thymeleaf模板,首先,必须在工程的Maven管理中引入它的依赖:"spring-boot-starter-thymeleaf",如代码清单3-9所示. 代码清单3-9 Thymeleaf依赖配置 <dependency>     <groupId>org.springframework.boot</groupId>     <artifactId>spring-boot-starter-t

3.5 运行与发布 本章实例工程的完整代码可以通过IDEA从GitHub中检出:https://github.com/chenfromsz/spring-boot-ui.git.Spring Boot需要一个启动程序作为应用的入口,在webui模块中,我们设计了一个入口程序,如代码清单3-25所示.使用这个入口程序,就可以调试和发布工程了. 代码清单3-25 Web应用启动主程序 package com.test.webui;   import org.springframework.boot.

3.6 小结 本章介绍了使用MVC的多层结构方式,以及在Spring Boot进行Web界面设计的方法,并且使用Thymeleaf模板设计了一个Web应用的页面框架.Web界面设计的一些细节,更多的是使用了HTML编码和JavaScript脚本,而HTML离不开CSS的支持,JavaScript更是借助于jQuery及其各种插件的功能.读者如需深入了解这方面的知识和技术,可查找相关的知识进行学习和研究.这里主要使用Thymeleaf模板工具来设计整体界面以及组织和处理数据的显示. 有了显示界面之

3.4.1 列表视图设计 电影的列表视图是电影视图的主页,它引用了3.3节使用Thymeleaf设计的页面框架模板layout.html,在这里主要实现对数据的分页查询请求和列表数据显示,并提供了一部电影的新建.查看.修改和删除等超链接. 1.?分页设计 电影的列表视图的分页设计使用了"jquery.pagination.js"分页插件,编写如代码清单3-15所示的脚本,其中getOpt定义了分页工具条的一些基本属性,pageaction通过"./list"调用控制

3.4.2 新建视图设计 1.?新建对话框设计 新建电影时,在电影主页中打开一个对话框显示新建的操作界面,对话框设计引用了"artDialog.js"的对话框插件,然后编写一个脚本来打开对话框,如代码清单3-17所示.其中"./new"是连接控制器的请求URL,注意这里使用了相对路径,这个URL通过"$.get"请求返回新建电影的HTML页面,请求链接中的ts参数传递的是当前时间,这是为了保证该链接是一个全新的链接,以使浏览器能显示一个最新的内容

3.1.2 关系实体建模 电影实体对应的角色关系实体建模的关系类型也同样做了调整而改为"扮演",如代码清单3-2所示. 代码清单3-2 角色关系实体建模 @JsonIdentityInfo(generator=JSOGGenerator.class) @RelationshipEntity(type = "扮演") public class Role {     @GraphId     Long id;     String name;     @StartNod

3.1.3 分页查询设计 对于新型的Neo4j数据库来说,由于它的资源库遵循了JPA的规范标准来设计,在分页查询方面有的地方还不是很完善,所以在分页查询中,设计了一个服务类来处理,如代码清单3-3所示.其中,使用Class<T>传入调用的实体对象,使用Pageable传入页数设定和排序字段设定的参数,使用Filters传入查询的一些节点属性设定的参数. 代码清单3-3 Neo4j分页查询服务类 @Service public class PagesService<T> {    

3.2.1 新建控制器 接收新建电影的请求,以及输入一部电影的数据后的最后提交,由新建控制器进行处理.在控制器上将执行两个操作,第一个操作将返回一个新建电影的视图,第二个操作接收界面中的输入数据,并调用数据管理模块进行保存,如代码清单3-4所示.其中,create函数将返回一个新建电影的视图,它不调用数据管理模块,save函数将需要保存的数据通过调用数据管理模块存储至数据库中,并返回一个成功标志.注意,为了简化设计,将电影剧照的图片文件做了预定义处理. 代码清单3-4 新建电影控制器 @Requ