<select id="selectCity" th:if="${#strings.isEmpty(userCity)}" style='border: 1px solid #ccc;text-indent: 1em;color: #666;border-radius: 6px; font-size: 16px;'> <option value="" selected>全部</option> <option value='14'>南京</option> <option value='15'>连云港</option> <option value='16'>徐州</option> <option value='17'>常州</option> <option value='18'>镇江</option> <option value='19'>无锡</option> <option value='20'>南通</option> <option value='21'>泰州</option> <option value='22'>盐城</option> <option value='23'>扬州</option> <option value='11'>苏州</option> <option value='12'>淮安</option> <option value='13'>宿迁</option> </select> <select id="selectCity1" th:if="${not #strings.isEmpty(userCity)}" th:switch="${userCity}" style='border: 1px solid #ccc;text-indent: 1em;color: #666;border-radius: 6px; font-size: 16px;'> <option th:case="14" th:selected="selected" value='14'>南京</option> <option th:case="15" th:selected="selected" value='15'>连云港</option> <option th:case="16" th:selected="selected" value='16'>徐州</option> <option th:case="17" th:selected="selected" value='17'>常州</option> <option th:case="18" th:selected="selected" value='18'>镇江</option> <option th:case="19" th:selected="selected" value='19'>无锡</option> <option th:case="20" th:selected="selected" value='20'>南通</option> <option th:case="21" th:selected="selected" value='21'>泰州</option> <option th:case="22" th:selected="selected" value='22'>盐城</option> <option th:case="23" th:selected="selected" value='23'>扬州</option> <option th:case="11" th:selected="selected" value='11'>苏州</option> <option th:case="12" th:selected="selected" value='12'>淮安</option> <option th:case="13" th:selected="selected" value='13'>宿迁</option> </select>
th:if 表示逻辑判断 如果为true 则这个标签展示,如果为false 这个标签不展示
<td th:if="${#strings.length(msgList.message)>=40}" th:text="${#strings.substring(msgList.message,0,40)}+'...'"></td> <td th:unless="${#strings.length(msgList.message)>=40}" th:text="${msgList.message}"></td>
th:if 一般与th:unless 成对使用。相当于代码中的if()....else if()....
th:value
th:text
thymeleaf的表达式一般用${...}来表示
${..} 里面可以是一个变量,亦可以是一个方法。相对于前后端分离项目 thymeleaf和jsp有很多相像之处。${}里面如果是值,这必须在后台接口中设置Model,这里的Model其实就是MVC框架中的Model。(这里不多阐述。)
model.addAttribute("pageInfo", discountAroundBeanPageInfo); model.addAttribute("fName", fName); model.addAttribute("fStatus", fStatus);
重点是${..}内的方法,这里记录几个常用的
${#strings.isEmpty(param)} //判断参数字符串是否为空 ${not #strings.isEmpty(param)} //判断参数字符串不为空 ${#strings.substring(param,0,4)} //截取字符串0~4的索引【遵循前闭后开原则】 ${#lists.size(paramList) eq 0} //判断集合大小是否等于0
<tr th:each="item,index:${list}"></tr> //这里是循环标签,item为list中的值,index为索引,有点类似vue
还有自定义属性,可以把一些不重要的数据放到属性中去
< input th:attr="data-mobile=${msgList.mobile},data-message=${msgList.message} />
还有一种用法,如何在js中获取Model的属性呢,有点类似闭包。
var status = "[[${fCarouselStatus}]]"; var doc1 = "[[${fCarouselName}]]"