springboot整合thymeleaf及常用標籤的使用方法
阿新 • • 發佈：2019-01-10
請結合springboot學習教程專案github地址 https://github.com/heng1234/spring-boot_one來理解
pom.xml
<!-- 引入 thymeleaf 模板依賴 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
application.properties
#資原始檔配置 ############################################################ # # thymeleaf 靜態資源配置 # ############################################################ spring.thymeleaf.prefix=classpath:/templates/ spring.thymeleaf.suffix=.html spring.thymeleaf.mode=HTML5 spring.thymeleaf.encoding=UTF-8 spring.thymeleaf.content-type=text/html # 關閉快取, 即時重新整理, 上線生產環境需要改為true spring.thymeleaf.cache=false
Controller
package com.yh.controller; import java.util.ArrayList; import org.springframework.stereotype.Controller; import org.springframework.ui.ModelMap; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestMapping; import com.yh.entity.User; @Controller @RequestMapping("thymeleaf") public class ThymeleafController { @RequestMapping("finduser") public String finduser(ModelMap map) { User u = new User(); u.setName("heng"); u.setAge(21); u.setUrl("https://blog.csdn.net/qq_39313596"); u.setDesc("<a href='https://blog.csdn.net/qq_39313596'>部落格地址</a>"); map.addAttribute("u",u); java.util.List<User> list = new ArrayList<User>(); User u2 = new User(); u2.setName("heng"); u2.setAge(17); u2.setUrl("https://blog.csdn.net/qq_39313596"); u2.setDesc("<a href='https://blog.csdn.net/qq_39313596'>部落格地址</a>"); User u3 = new User(); u3.setName("heng"); u3.setAge(19); u3.setUrl("https://blog.csdn.net/qq_39313596"); u3.setDesc("<a href='https://blog.csdn.net/qq_39313596'>部落格地址</a>"); User u4 = new User(); u4.setName("heng"); u4.setAge(21); u4.setUrl("https://blog.csdn.net/qq_39313596"); u4.setDesc("<a href='https://blog.csdn.net/qq_39313596'>部落格地址</a>"); list.add(u2); list.add(u3); list.add(u4); map.addAttribute("list", list); return "/thymeleaf/index"; } @PostMapping("saveUser") public String saveUser(User u) { System.out.println(u); return "redirect:../thymeleaf/finduser"; } }
html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<!-- <script th:src="@{/static/js/test.js}"></script> --> <!-- 引入js檔案 需要在後端資原始檔配置thymeleaf引入靜態檔案 -->
<body>
<p th:text="${u.name}"></p>
<p th:text="${u.age}"></p>
<p th:text="${u.url}"></p>
<p th:text="${u.desc}"></p>
<p th:utext="${u.desc}"></p>
<div th:object="${u}">
<p th:text="*{name}"></p>
<p th:text="*{age}"></p>
<p th:text="*{url}"></p>
<p th:text="*{desc}"></p>
<p th:utext="*{desc}"></p>
</div>
<form th:action="@{saveUser}" method="post" th:object="${u}" th:method="post">
<input type="text" th:field="*{name}"/>
<input type="text" th:field="*{age}"/>
<input type="text" th:field="*{url}"/>
<input type="text" th:field="*{desc}"/>
<input type="submit"/>
</form>
<select>
<option >選擇框</option>
<option th:selected="${u.name eq 'lee'}">lee</option> <!-- eq是等於的意思 -->
<option th:selected="${u.name eq 'heng'}">heng</option>
<option th:selected="${u.name eq 'LeeCX'}">LeeCX</option>
</select>
<table>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>年齡備註</th>
<!-- <th>生日</th>-->
</tr>
<tr th:each="person:${list}">
<td th:text="${person.name}"></td>
<td th:text="${person.age}"></td>
<td th:text="${person.age gt 18} ? 你成熟了 : 你還年輕">18歲</td>
<!-- <td th:text="${#dates.format(user.birthday, 'yyyy-MM-dd hh:mm:ss')}"></td> -->
</tr>
</table>
<br/>
<br/>
<div th:switch="${u.name}">
<p th:case="'lee'">lee</p>
<p th:case="A">普通管理員</p>
<p th:case="heng">超級管理員</p>
<p th:case="*">其他使用者</p>
</div>
<br/>
</body>
</html>