thymeleaf

時間 2019-11-17

標籤 thymeleaf 简体版

原文原文鏈接

經常使用thymeleaf標籤javascript

th:value       屬性賦值               <input th:value="${user.name}" />
th:onclick     點擊事件               th:onclick="'getCollect()'"
th:each        屬性賦值               tr th:each="user,userStat:${users}">
th:if          判斷條件               <a th:if="${userId == collect.userId}" >
th:unless      和th:if判斷相反        <a th:href="@{/login}" th:unless=${session.user != null}>Login</a>
th:href        連接地址               <a th:href="@{/login}" th:unless=${session.user != null}>Login</a> />
th:src         圖片類地址引入          <img class="img-responsive" alt="App Logo" th:src="@{/img/logo.png}" />
th:selected    selected選擇框 選中    th:selected="(${xxx.id} == ${configObj.dd})"

th:id          替換id                <input th:id="'xxx' + ${collect.id}"/>
th:text        文本替換               <p th:text="${collect.description}">description</p>
th:utext       支持html的文本替換      <p th:utext="${htmlcontent}">conten</p>
th:object      替換對象               <div th:object="${session.user}">
th:style       設置樣式               th:style="'display:' + @{(${sitrue} ? 'none' : 'inline-block')} + ''"

th:switch      多路選擇 配合th:case使用    <div th:switch="${user.role}">
th:case        th:switch的一個分支        <p th:case="'admin'">User is an administrator</p>

th:fragment    佈局標籤，定義一個代碼片斷，方便其它地方引用    <div th:fragment="alert">
th:include     佈局標籤，替換內容到引入的文件        <head th:include="layout :: htmlhead" th:with="title='xx'"></head> />
th:replace     佈局標籤，替換整個標籤到引入的文件     <div th:replace="fragments/header :: title"></div>

th:inline      定義js腳本能夠使用變量              <script type="text/javascript" th:inline="javascript">
th:action      表單提交的地址                     <form action="subscribe.html" th:action="@{/subscribe}">

七大基礎對象：html

${#ctx} 上下文對象，可用於獲取其它內置對象。
${#vars}: 上下文變量。
${#locale}：上下文區域設置。
${#request}: HttpServletRequest對象。
${#response}: HttpServletResponse對象。
${#session}: HttpSession對象。
${#servletContext}: ServletContext對象。java

經常使用的工具類：數組

#strings：字符串工具類
#lists：List 工具類
#arrays：數組工具類
#sets：Set 工具類
#maps：經常使用Map方法。
#objects：通常對象類，一般用來判斷非空
#bools：經常使用的布爾方法。
#execInfo：獲取頁面模板的處理信息。
#messages：在變量表達式中獲取外部消息的方法，與使用＃{...}語法獲取的方法相同。
#uris：轉義部分URL / URI的方法。
#conversions：用於執行已配置的轉換服務的方法。
#dates：時間操做和時間格式化等。
#calendars：用於更復雜時間的格式化。
#numbers：格式化數字對象的方法。
#aggregates：在數組或集合上建立聚合的方法。
#ids：處理可能重複的id屬性的方法。session

【內聯寫法】app

標準格式爲：[[${xx}]] ，能夠讀取服務端變量，也能夠調用內置對象的方法。less

thymeleaf使用Demo(頁面部分代碼)工具

@Controller
@RequestMapping("/order")
public class OrderController {

       @RequestMapping("/orderlist")
        public String orderList(User user,ModelMap map){
        List<Orders> orders = ordersService.queryOrdersByUid(user.getId());
        //System.out.println("訂單列表數據： "+orders);
        map.put("orders",orders);
        return "orderlist";
    }
}

<-- orderlist.html -->
<!-- 右邊購物列表 -->
    <div class="shop_member_bd_right clearfix">
        <div class="shop_meber_bd_good_lists clearfix">
            <div class="title"><h3>訂單列表</h3></div>
            <table>
                <thead class="tab_title">
                <th style="width:410px;"><span>商品信息</span></th>
                <th style="width:100px;"><span>單價</span></th>
                <th style="width:80px;"><span>數量</span></th>
                <th style="width:100px;"><span>訂單總價</span></th>
                <th style="width:115px;"><span>狀態與操做</span></th>
                </thead>
                <tbody>

                <!-- 一個訂單 -->
                <tr th:each="order : ${orders}">
                    <td colspan="5">
                    <table class="good">
                        <thead >
                        <tr><th colspan="6">
                            <span><strong>訂單號碼：</strong>[[${order.orderid}]]</span>
                        </th></tr>
                        </thead>
                        <tbody>

                        <!-- 一個訂單詳情 -->
                        <tr th:each="orderdetil,orderdetilState : ${order.orderDetils}">
                            <td class="dingdan_pic"><img style="height: 80px;width: 100px" th:src="|http://xx.xx.xx.xx/${#strings.setSplit(orderdetil.gimage, '|')[0]}|" src="images/1dbc94fa0d60cba3990b89ccb01f82c2.jpg_tiny.jpg" /></td>
                            <td class="dingdan_title"><span><a th:text="${orderdetil.gname}">李寧 lining 專櫃正品 足球鞋 女式運動鞋【演示數據】</a></span><br /></td>
                            <td class="dingdan_danjia">￥<strong th:text="${orderdetil.gprice}">25.00</strong></td>
                            <td class="dingdan_shuliang" th:text="${orderdetil.gnumber}">1</td>
                            <!-- 後兩列跨行
                            th:if="${orderdetilState.first}"   若是是第一行，first返回ture 就顯示這條記錄
                            -->
                            <td th:rowspan="${#arrays.length(order.orderDetils)}" th:if="${orderdetilState.first}" class="dingdan_zongjia">￥<strong th:text="${order.allprice}">25.00</strong><br />(免運費)</td>
                            <td th:switch="${order.status}" th:rowspan="${#arrays.length(order.orderDetils)}" th:if="${orderdetilState.first}" class="digndan_caozuo">
                                <a th:case="0">待付款<br/> <a th:href="|/pay/alipay?orderid=${order.orderid}|">去付款</a></a>
                                <a th:case="1">待發款</a>
                                <a th:case="2">待收貨</a>
                                <a th:case="3">已收貨</a>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </td></tr>
                </tbody>
            </table>
        </div>
    </div>

頁面效果：佈局

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。