Thymeleaf 随记
一.基础写法: th:text='${数据} ,其中text可以修改成其他,如href,value,class....看需求
<p th:text='${后台返回的数据}'>静态文本</p> <!--文本输出-->
<input th:value="${后台返回的数据}" /> <!--输入框value值-->
<a th:href='${href}'>超链接</a>
<img th:src='${path}' /> <!--path为后台返回的路径-->
注:th:utext可以解析标签,而th:text不能解析标签,如果后台传的数据有带标签的会原封不动的输出来
var box='<p><b>hello</b></p>'; //前台接受数据
<div th:text="${box}"></div> ---->输出<p><b>hello</b></p>
<div th:utext="${box}"></div> ---->输出hello,并通过b标签进行加粗
二.循环
<!--循环(arr为后台穿的数组,包括id和name值)--> <th:block th:each='list,state : ${arr}'>
<li th:text='${list.id}'></li>
<li th:text='${list.name}'></li>
<li th:text='${state.index}'></li> <!--state.index为循环的索引,从0开始-->
<li th:text='${state.count}'></li> <!--state.count为循环的索引,从1开始-->
<li th:text='${state.size}'></li> <!--state.size为对象的大小,长度-->
<li th:text='${state.current}'></li> <!--state.current迭代的变量-->
<li th:text='${state.even}'></li> <!--布尔值,当前循环是否为偶数-->
<li th:text='${state.odd}'></li> <!--布尔值,当前循环是否为奇数-->
<li th:text='${state.first}'></li> <!--布尔值,当前循环是否为第一个-->
<li th:text='${state.last}'></li> <!--布尔值,当前循环是否为最后一个-->
</th:block>
注: <th:block></th:block> thymealeaf解析时会移除掉此标签对,但不会移除其中的内容。(一般出现在循环和公共引用中)
三:定义块,引用块
<!--定义一个可以引用的块,th:fragment='meta' meta:块名字可以随意取,根据内容-->
<th:block th:fragment='meta'>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
</th:block> <!--引用上面定义的块 ,meta是定义块的名字-->
<th:block th:include="(${块路径})'::meta"></th:block>
<!--replace替换标签-->
<th:block th:replace="(${块路径})'::meta"></th:block>
四:if条件,unless条件(与if相反)
<!--if条件判断,arr为后台传过来的数据-->
<th:block th:each='list,state :${arr}'>
<li th:if='${state.index lt 2}' th:text='${list}'></li> <!--如果遍历的所以值小于2,获取遍历的list列表,其他索引大于等于2的的不遍历-->
<li th:unless='${list==null}'>login</li> <!--list遍历项为空,则不显示,unless与if条件相反-->
</th:block>
注: 两个值比较的对应的表达式
> gt
< lt
>= ge
<= le
== eq
!= ne
五:switch...case
<!--如果遍历出来的值为张三,则显示'名叫张三'-->
<!--如果遍历出来的值为李四,则显示'名叫李四'-->
<th:block th:each='list,state :${arr}'>
<li th:switch='${list.name}'>
<span th:case='张三' th:text='名叫张三'></span>
<span th:case='李四' th:text='名叫李四'></span>
</li>
</th:block>
注:满足其中一个条件才会显示对应的值,如果都不满足,则不显示.不同display:block,这里是标签都没有,没有这个元素,上面的if条件也一样
六:select
<select th:field='${sex}' th:switch='${sex.tostring}'>
<option value="男" th:case='男' th:selected='selected'>男</option>
<option value="女" th:case='女' th:selected='selected'>女</option>
<option value="" >请选择</option>
</select>
注:后台取的sex数据,如果对应的值为男,则显示''男'',为女则显示''女'',如果为空,则默认显示'请选择'
Thymeleaf 随记的更多相关文章
- 记一次SpringBoot 开发中所遇到的坑和解决方法
记一次SpringBoot 开发中所遇到的坑和解决方法 mybatis返回Integer为0,自动转型出现空指针异常 当我们使用Integer去接受数据库中表的数据,如果返回的数据中为0,那么Inte ...
- Thymeleaf模板引擎的初步使用
在springboot中,推荐使用的模板引擎是Thymeleaf模板引擎,它提供了完美的Spring MVC的支持.下面就简单的介绍一下Thymeleaf模板引擎的使用. 在controller层中, ...
- [SpringBoot——Web开发(使用Thymeleaf模板引擎)]
[文字只能描述片段信息,具体细节参考代码] https://github.com/HCJ-shadow/SpringBootPlus 引入POM依赖 <properties> <ja ...
- Springboot模板(thymeleaf、freemarker模板)
目的: 1.thymeleaf模板 2.Freemarker模板 thymeleaf模板 thymeleaf 的优点: 支持html5标准,页面无须部署到servlet开发到服务器上,直接通过浏览器就 ...
- Spark踩坑记——Spark Streaming+Kafka
[TOC] 前言 在WeTest舆情项目中,需要对每天千万级的游戏评论信息进行词频统计,在生产者一端,我们将数据按照每天的拉取时间存入了Kafka当中,而在消费者一端,我们利用了spark strea ...
- Spark踩坑记——数据库(Hbase+Mysql)
[TOC] 前言 在使用Spark Streaming的过程中对于计算产生结果的进行持久化时,我们往往需要操作数据库,去统计或者改变一些值.最近一个实时消费者处理任务,在使用spark streami ...
- 这些年一直记不住的 Java I/O
参考资料 该文中的内容来源于 Oracle 的官方文档.Oracle 在 Java 方面的文档是非常完善的.对 Java 8 感兴趣的朋友,可以从这个总入口 Java SE 8 Documentati ...
- 千回百折:百度Java研发offer斩获记和经验分享
起因 面试过程 等待offer的过程中悟道 Java面试常考知识点个人总结 过程 百度——作为国内互联网的巨头之一,最近的一些风波对其褒贬不一,但是类似事件不是第一次发生,也绝对不是最后一次,对于真的 ...
- spring boot(四):thymeleaf使用详解
在上篇文章springboot(二):web综合开发中简单介绍了一下thymeleaf,这篇文章将更加全面详细的介绍thymeleaf的使用.thymeleaf 是新一代的模板引擎,在spring4. ...
随机推荐
- 老男孩python作业9-简单的商城页面布局
利用HTML相关知识编写下面的网页: 核心代码如下: <!DOCTYPE html> <html lang="en"> <head> <m ...
- ul li做横向导航栏例子
/* ul li以横排显示 */ /* 所有class为menu的div中的ul样式 */ div.menu ul { list-style:none; /* 去掉ul前面的符号 */ margin: ...
- Oracle trunc函数使用
select to_char(sysdate, 'yyyy-mm-dd hh24:mi:ss'), to_char(trunc(sysdate), 'yyyy-mm-dd hh24:mi:ss') f ...
- web前端开发道路
https://github.com/z-jingjie/developer-roadmap-zh-CN
- Naive Operations
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6315 学习博客:https://blog.csdn.net/SunMoonVocano/article ...
- (转)Python作业day2购物车
Python作业day2购物车 原文:https://www.cnblogs.com/spykids/p/5163108.html 流程图: 实现情况: 可自主注册, 登陆系统可购物,充值(暂未实现) ...
- 我使用的brackets插件
livereload atom dark theme autoprefixer auto save files on window blur beautify brackets file icons ...
- 你会用setTimeout吗
定义很简单 setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式. 广泛应用场景 定时器,轮播图,动画效果,自动滚动等等 上面一些应该是setTimeout在大家心中的样子,因为我们 ...
- 移动Web开发与适配笔记
项目要是适配手机端,想透彻的把相关内容弄清楚,现在总结一下. 一.移动端开发有如下特点: 1.跑在手机端的web 页面就是h5页面 2.具有跨平台性(web 安卓 iOS都适应) 3.基于webvie ...
- iOS-swift-枚举和结构体
1.枚举 使用关键字 enum 创 建枚举. 枚举默认起始值为 0,可以自定义起始值. 在枚举中可以定义方法,和类中定义的一样. 使用关键字 rawValue 访问当前枚举的值. enum Rank: ...