SpringBoot_整合视图层技术
SpringBoot整合视图层技术
在目前的企业级应用开发中,前后端分离是趋势,但是视图层技术还占有一席之地。Spring Boot对视图层技术提供了很好的支持,官方推荐使用的模板引擎是Thymeleaf,不过像FreeMarker也支持,JSP 技术在这里并不推荐使用。
Thymeleaf
配置
引入jar包:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
spring boot配置:
#thymeleaf start
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
#开发时关闭缓存,不然没法看到实时页面
spring.thymeleaf.cache=false
#thymeleaf end
页面引入:
<html xmlns:th="http://www.thymeleaf.org">
标签的使用
引入url
<a th:href="@{http://blog.csdn.net/u012706811}">绝对路径</a>
<a th:href="@{/}">相对路径</a>
<a th:href="@{css/bootstrap.min.css}">Content路径,默认访问static下的css文件夹</a>
当要写动态链接时括号属性如:@{user(id=${user.id})()..} 相等于 user?id=1&..
th:action
<form id="form" th:action="@{/login}">...</form>
th:href
<a th:href="@{/logout}" ></a>
th:src
<script th:src="@{/resources/js/jquery/jquery.json-2.4.min.js}"
th:text
<td th:text="${username}" ></td>
th:value
<option th:value="Adult">Adult</option>
<input type="hidden" th:value="${msg}" />
th:include
th:replace
th:fragment
声明定义该属性的div为模板片段,常用与头文件、页尾文件的引入。常与th:include,th:replace一起使用。
例如:
声明模板片段/WEBINF/templates/footer. html
<div th: fragment=" copy" >
© 2011 The Good Thymes Virtual Grocery
</div>
引入模板片段
<div th: include=" /templates/footer : : copy" ></div>
<div th: replace=" /templates/footer : : copy" ></div>
th:if
<div th:if="${rowStat.index} == 0">... do something ...</div>
th:each
<form id="login-form" th:action="@{/addStudent}"
th:object="${stuReqBean}" method="POST">
<div class="student" th:each="stuIter,rowStat:${stuReqBean.students}">
<input type="text" class="firstName" value=""
th:field="*{students[__${rowStat.index}__].firstName}"></input>
<input type="text" class="school" value=""
th:field="*{students[__${rowStat.index}__].school}"></input>
...
</div>
</form>
上面的例子中通过选择表达式*{}既能将表单绑定到后台的StudentRequestBean中的集合属性students,也能将Servlet上下文中的StudentRequestBean中的List类型的students变量回显,回显时通过th:each进行遍历。
注意1:绑定集合属性元素下标的用法*{students[__${rowStat.index}__].firstName}
注意2:如果List<Student> students为null,页面将无法显示表单,后台必须给students初始化一个值,即:
List<Student > stus = new ArrayList<Student >();
stus .add(new Student ());
StudentRequestBean.setStudents(stus );
注意3:stuIter代表students的迭代器
th:object
<form id="login-form" th:action="@{/login}" th:object="${loginBean}">...</form>
th:field
<form id="login-form" th:action="@{/login}" th:object="${loginBean}">...
<input type="text" value="" th:field="*{username}"></input>
<input type="text" value="" th:field="*{user[0].username}"></input>
</form>
SpringBoot_整合视图层技术的更多相关文章
- Spring Boot 整合视图层技术
这一节我们主要学习如何整合视图层技术: Jsp Freemarker Thymeleaf 在之前的案例中,我们都是通过 @RestController 来处理请求,所以返回的内容为json对象.那么如 ...
- Spring Boot 整合视图层技术,application全局配置文件
目录 Spring Boot 整合视图层技术 Spring Boot 整合jsp Spring Boot 整合freemarker Spring Boot 整合视图层技术 Spring Boot 整合 ...
- SpringBoot视图层技术
一.SpringBoot整合jsp 在maven的dependencies的依赖中除了springBoot启动器还要添加对jstl和jsp的依赖. <dependencies> <d ...
- SpringBoot整合持久层技术--(一)JdbcTemplate
简介: JdbcTemplate是Spring提供的一套JDBC模板框架,利用AOP技术解决直接使用JDBC带来的重复代码问题.它没有MyBatis使用那么灵活,但是却比直接使用JDBC方便得多.Sp ...
- SpringBoot整合持久层技术--(三)Spring Data JPA
简介: JPA(java Persistence API)和SpringData是两个范畴的概念.spring data jpa是spring公司下的spring data项目的一个模块. sprin ...
- SpringBoot整合持久层技术--(二)MyBatis
简介: 原名iBatis,SpringBoot中使用MyBatis: pom.xml <dependency> <groupId>org.springframework.boo ...
- Spring Boot 整合Web 层技术(整合Servlet)
1 整合Servlet 方式一1.1通过注解扫描完成Servlet 组件的注册 1.1.1创建Servlet /*** 整合Servlet 方式一*/@WebServlet(name = & ...
- SpringBoot整合持久层技术-创建项目
新建项目 Pom.xml文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns=&q ...
- springboot整合持久层技术(mysql驱动问题)
java.sql.SQLException: The server time zone value '�й���ʱ��' is unrecognized or represents more tha ...
随机推荐
- wsgiref — WSGI Utilities and Reference Implementation nginx
from wsgiref.util import setup_testing_defaults, request_urifrom wsgiref.simple_server import make_s ...
- 连通图(Tarjan算法) 专题总结
一.题目类型: 1.有向图的强连通分量: POJ1236 Network of Schools HDU1269 迷宫城堡 2.割点 & 割边: UESTC - 900 方老师炸弹 UVA315 ...
- I.MX6 MAC Address 导致的系统崩溃
/**************************************************************************** * I.MX6 MAC Address 导致 ...
- Mybatis中用到的设计模式
Mybatis中用到至少用到以下设计模式, Builder模式,例如SqlSessionFactoryBuilder.XMLConfigBuilder.XMLMapperBuilder.XMLStat ...
- 优化Laravel的分页LIMIT和OFFSET调用
在分页系统中使用limit和offset是很常见的,它们通常也会和ORDER BY一起使用.索引对排序较有帮助,如果没有索引就需要大量的文件排序. 一个常见的问题是偏移量很大,比如查询使用了LIMIT ...
- 小程序-demo:知乎日报
ylbtech-小程序-demo:知乎日报 1.返回顶部 0. 1.app.js //app.js App({ onLaunch: function () { //调用API从本地缓存 ...
- jsDoc 使用及配置!
原文地址:http://www.cnblogs.com/hxling/archive/2012/11/27/2791067.html jsDoc 说白了就是帮助你生成JS的文档,但有个前提,就是你编写 ...
- 一步一步学Vue(六)
本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...
- PCB 合拼遍历(全排序+旋转90度) 基本遍历方法
分享一下PCB合拼的组合的遍历方法,在分享之前先纠正一下 PCB拼板之多款矩形排样算法实现--学习 时间复杂度计算错误 一.PCB 合拼(全排序+旋转90度)的时间复杂度是多少? 二.合拼遍历(全 ...
- bzoj 2876: [Noi2012]骑行川藏【拉格朗日乘数法+二分】
详见: http://blog.csdn.net/popoqqq/article/details/42366599 http://blog.csdn.net/whzzt/article/details ...