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数据,如果对应的值为男,则显示''男'',为女则显示''女'',如果为空,则默认显示'请选择'

转载于:https://www.cnblogs.com/xiaoxinzi/p/8494686.html