【springboot】Thymeleaf笔记

最新推荐文章于 2022-11-10 10:15:21 发布

知足Content+

最新推荐文章于 2022-11-10 10:15:21 发布

阅读量466

点赞数

分类专栏： springboot 文章标签： thymelaef java springboot 模板引擎前端

本文链接：https://blog.csdn.net/weixin_44197120/article/details/114971002

版权

springboot 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

文章目录

标准变量：

<div th:text="${user.id}"></div>

选择变量：

<div th:object="*{user}">
    <span th:text="*{id}"></span>
</div>

路径表达式：


<a href="https://www.baidu.com">传统写法</a>
<a th:href="@{http://localhost:8080/user/detail}">th路径表达式绝对路径，不带参数</a>
<a th:href="@{/user/detail}">th路径表达式相对路径，不带参数</a>
<a th:href="@{http://localhost:8080/user/detail?username=zhangsan}">th路径表达式绝对路径,带参数</a>
<a th:href="@{/user/detail?username=lisi}">th路径表达式绝对路径</a>

<a th:href="@{'/user/detail?username='+${name}+'&id='+${id}}">th路径表达式相对路径，获取参数</a>
<a th:href="@{'/user/detail(username=${name},id={id})}">th路径表达式相对路径，获取参数</a>

图片文件：


<img th:src="@{/img/001.jpg}">      它默认就是从static里面找的

循环遍历list集合：


<!--
	user:当前循环的变量名称（随意）
	userStat:当前循环对象状态的变量（可选，默认就是对象变量名+Stat）
	${userList}:当前循环的集合

-->
<div th:each="user,userStat:${userList}">
    <span th:text="${userStat.count}"></span> <!--索引-->
	<span th:text="${user.id}"></span>
    <span th:text="${user.name}"></span>
    <span th:text="${user.age}"></span>
    <span th:text="${user.address}"></span>
    
</div>

循环遍历Array数组


<!--
	user:当前循环的变量名称（随意）
	userStat:当前循环对象状态的变量（可选，默认就是对象变量名+Stat）
	${userArray}:当前循环的数组

-->
<div th:each="user,userStat:${userArray}">
    <span th:text="${userStat.count}"></span> <!--索引-->
	<span th:text="${user.id}"></span>
    <span th:text="${user.name}"></span>
    <span th:text="${user.age}"></span>
    <span th:text="${user.address}"></span>
    
</div>

混合遍历：


<h2>循环遍历复杂集合:list -> Map -> list -> User</h2>
<div th:each="myListMap:${myList}">
    <div th:each="myListMapObj:${myListMap}">
        Map集合的key:<span th:text="${myListMapObj.key}"></span>
        <div th:each="myListMapObjList:${myListMapObj.value}">
            <span th:text="${myListMapObjList.id}"></span>
            <span th:text="${myListMapObjList.nick}"></span>
            <span th:text="${myListMapObjList.phone}"></span>
            <span th:text="${myListMapObjList.address}"></span>
        </div>
    </div>
</div>

条件判断if：


<body>
<h1>th:if 用法:如果满足条件显示(执行),否则相反</h1>
<div th:if="${sex eq 1}">  //sex等于1
    男
</div>
<div th:if="${sex eq 0}">
    女
</div>

<h1>th:unless 用法:与th:if用法相反,即条件判断取反</h1>
<div th:unless="${sex ne 1}">
    女
</div>

<h1>th:switch/th:case用法</h1>
<div th:switch="${productType}">
    <span th:case="0">产品0</span>
    <span th:case="1">产品1</span>
    <span th:case="*">无此产品</span>
</div>

内敛表达式：


<body th:inline="text">
<div th:text="${data}">xxx</div>
<h3 th:text="${data}">xxx</h3>

<h1>内敛文本: th:inline="text"</h1>
<div th:inline="text">

    数据:[[${data}]]

</div>

数据outside:[[${data}]]

<h1>内敛脚本 th:inline="javascript"</h1>
<script type="text/javascript"  th:inline="javascript">
    function showData() {
        alert([[${data}]]);
        alert("----");
    }
</script>
<button th:onclick="showData()">展示数据</button>
</body>

字面量：

    
<h1>文本字面量,用单引号'....'的字符串就是字面量</h1>
<a th:href="@{'/user/detail?sex=' + ${sex}}">查看性别</a>
<span th:text="Hello"></span>

<h1>数字字面量</h1>
今年是<span th:text="2020">1949</span>年<br/>
20年后是<span th:text="2020+20">1969</span>年<br/>

<h1>boolean字面量</h1>
<div th:if="${flag}">
    执行成功
</div>
<div th:if="${!flag}">
    不成功
</div>

<h1>null字面量</h1>
<span th:text="${user.id}"></span>
<div th:unless="${userDetail eq null}">
    对象已创建,地址不为空
</div>

<div th:if="${userDetail.id eq null}">
    空
</div>

拼接字符串：


<body>
<span th:text="'共'+${totalRows}+'条'+${totalPage}+'页,当前第'+${currentPage}+'页,首页 上一页 下一页 尾页'">共120条12页,当前第1页,首页 上一页 下一页 尾页</span>

<h1>使用更优雅的方式来拼接字符串: |要拼接的字符串内容|</h1>

<span th:text="|共${totalRows}条${totalPage}页,当前第${currentPage}页,首页 上一页 下一页 尾页|">共120条12页,当前第1页,首页 上一页 下一页 尾页</span>
</body>

数字运算：

    
<body>
<!--
    三元运算 ：表达式?” 正确结果”:” 错误结果”
    算术运算： ：+ , - , * , / , %
    关系比较: ：> , < , >= , <= ( gt , lt , ge , le )
    相等判断： ：== , != ( eq , ne )

    ne -> not equal
    eq -> equal
    ge -> great equal
    le -> little equal
    gt -> great
    lt -> little
-->
<h1>三元运算符 表达式?正确:错误</h1>
<div th:text="${sex eq 1 ? '男':'女'}"></div>
<div th:text="${sex == 1 ? '男':'女'}"></div>

<h1>算术运算</h1>
20+5=<span th:text="20+5"></span><br/>
20-5=<span th:text="20-5"></span><br/>
20*5=<span th:text="20*5"></span><br/>
20/5=<span th:text="20/5"></span><br/>
20%3=<span th:text="20%3"></span><br/>

<h1>关系比较</h1>
5>2为<span th:if="5 gt 2">真</span><br/>
5>2为<span th:if="5 > 2">真</span><br/>
5<2<span th:unless="5 lt 2">真</span><br/>
5<2<span th:unless="5 < 2">真</span><br/>
1>=1<span th:if="1 ge 1">真</span><br/>
1>=1<span th:if="1 >= 1">真</span><br/>
1<=1<span th:if="1 le 1">真</span><br/>
1<=1<span th:if="1 <= 1">真</span><br/>

<h1>相等判断</h1>
<span th:if="${sex == 1}">男</span>
<span th:if="${sex eq 1}">男</span>
<span th:unless="${sex ne 1}">女</span>

</body>

从session中取数值：


<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>从SESSION中获取值</h1>
<span th:text="${#session.getAttribute('data')}"></span><br/>
<span th:text="${#httpSession.getAttribute('data')}"></span><br/>
<span th:text="${session.data}"></span><br/>

<script type="text/javascript" th:inline="javascript">
    // http://localhost:8080/springboot/user/detail
    //获取协议名称
    var scheme = [[${#request.getScheme()}]];

    //获取服务器名称
    var serverName = [[${#request.getServerName()}]];

    //获取服务器端口号
    var serverPort = [[${#request.getServerPort()}]];

    //获取上下文根
    var contextPath = [[${#request.getContextPath()}]];

    var allPath = scheme + "://" +serverName+":"+serverPort+contextPath;

    var requestURL = [[${#httpServletRequest.requestURL}]];
    var queryString = [[${#httpServletRequest.queryString}]];

    var requestAddress = requestURL + "?" +queryString;

    alert(requestAddress);


</script>
</body>
</html>

功能对象：

<body>

<div th:text="${time}"></div>
<div th:text="${#dates.format(time,'yyyy-MM-dd HH:mm:ss')}"></div>
<div th:text="${data}"></div>
<div th:text="${#strings.substring(data,0,10)}"></div>
<div th:text="${#lists}"></div>

</body>

往往从后台取值的时候用th（一定加），其他时候不需要用

知足Content+

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
【springboot】Thymeleaf笔记

文章目录标准变量：选择变量：路径表达式：图片文件：循环遍历list集合：循环遍历Array数组混合遍历：条件判断if：内敛表达式：字面量：拼接字符串：数字运算：从session中取数值：功能对象：标准变量：<div th:text="${user.id}"></div>选择变量：<div th:object="*{user}"> <span th:text="*{id}"></span></div>路径表达式：
复制链接

扫一扫