springboot和thymeleaf开发web应用

  • Z时代
  • 2024-01-10
  • 分类：综合

编程

<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
	<groupId>org.springframework.boot</groupId>
	<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

2、application.properties添加thymeleaf配置项

spring.thymeleaf.enabled=true
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.cache=false
spring.thymeleaf.check-template=true
spring.thymeleaf.check-template-location=true

thymeleaf常用语法

在html页面中引入thymeleaf命名空间
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

变量表达式(获取变量值)
<div th:text=""内容，"+ ${session.book} +"!!"">
    如果有数据，被替换完成前后端分离效果
</div>

字符截取长度
<td th:if="${#strings.length(user.desc) gt 5 } "  th:text="${#strings.substring(user.desc,0,5) + "…"}"></td>

<a th:href="@{/login}" th:unless=${session.user != null}>Login</a>
th:unless 于 th:if 恰好相反，只有表达式中的条件不成立，才会显示其内容。

下拉选择
<select name="subId" id="subId" lay-verify="" >
    <option value="">请选择</option>
    <option th:each="user:${userList}" th:selected="${user.id == subId}"    th:value="${user.id}" th:text="${user.name}"></option>
</select>

@{/usethymeleaf}是Context相关的相对路径，在渲染时会自动添加上当前Web应用的Context名字，假设context名字为seconddemo，
那么结果应该是/seconddemo/usethymeleaf，即URL中以”/“开头的路径(比如/usethymeleaf将会加上服务器地址和域名和应用cotextpath，形成完整的URL。
<a th:href="@{http://www.baidu.com}">绝对路径</a>
<a th:href="@{/}">相对路径</a>
<a th:href="@{css/bootstrap.min.css}">Content路径,默认访问static下的css文件夹</a>

<tr th:each="user:${user}">
    <td th:switch="${user.male}">
        <span th:case="1">男</span>
        <span th:case="2">女</span>
        <!--其他情况-->
        <span th:case="*">未知</span>
    </td>
</tr>

引入模块
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<body>
  <div th:fragment="footer">
     © 2020 xxx
  </div>
</body>
</html>

<!--写入绝对路径即可引入 -->
<div th:include="/footer :: footer"></div>

<th:block th:each="user,iterStat:${userList}">
    111
    <span th:text="${user}"></span>
        <th:block th:if="${iterStat.index le 1}">
            <span th:text="${user.name}"></span>
        </th:block>
</th:block>

<h2 th:object="${user}">
    <p>Name: <span th:text="*{name}">zhangsan</span>.</p>
    <p>Age: <span th:text="*{age}">18</span>.</p>
    <p>friend: <span th:text="*{friend}">Rose</span>.</p>
</h2>

日期格式化
<td th:text="${#dates.format(user.createDate,"yyyy-MM-dd HH:mm:ss")}"  ></td>

js取值
<script th:inline="javascript"  >
    var id= [[${user.id}]];
    console.info(id);
</script>

css取值
<style th:inline="css">
.[[${classname}]] {
  text-align: [[${align}]];
}
</style>

以上是 springboot和thymeleaf开发web应用 的全部内容， 来源链接： utcz.com/z/514274.html

回到顶部