##Template Engine
- In addition to JSP, SpringBoot also provides many other template engines, such as freemarker, thymeleaf, and so on.
- JSP is officially not recommended for SpringBoot, and Thymeleaf is the view layer technology recommended for SpringBoot.
- Thymeleaf files default to the src/main/resources/templates path.This directory is a protected directory and cannot be accessed directly through the HTTP protocol. After all, thymeleaf is a view template. If accessed directly from outside, it will lack the process of data rendering and will not display view logic properly.
Introduction to ##thymeleaf
- Thymeleaf is a modern server-side Java template engine for the Web and stand-alone environments.
- thymeleaf's template is HTML, so it can be displayed directly and correctly in a browser. thymeleaf can handle HTML, XML, JavaScript, CSS and even plain text.
Use of ##thymeleaf.
Add thymeleaf starter
Note: In low versions of Thymeleaf technology, the requirements for HTML tags are consistent with xml.However, it does not conform to the common definition of HTML.This can be avoided by providing a higher version of the Thymeleaf-related jar package.After Thymeleaf-dialect2.x and Thymeleaf 3.x, there are no more strict restrictions on HTML good structure.
<properties>
<java.version>1.8</java.version>
<thymeleaf-layout-dialect.version>2.4.1</thymeleaf-layout-dialect.version>
<thymeleaf.version>3.0.11.RELEASE</thymeleaf.version>
</properties>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
thymeleaf configuration (application.yml)
server:
port: 80
spring:
thymeleaf:
mode: HTML5
encoding: UTF-8
cache: false #Hot deploy file, page does not generate cache, update in time
servlet:
multipart:
max-file-size: 100MB #Maximum volume of a single file
max-request-size: 100MB #Maximum volume of all files in a single request
To use Thymeleaf's API, you need to add attributes in the html tag
<html lang="en" xmlns:th="http://www.thymeleaf.org">
Introduction to Common API s for ##Thymeleaf
- th:text - Text display properties
- th:utext - Text output as is
- th:value - Data entry property, equivalent to the value property in HTML Tags
- th:action - Used to define the submission path for form forms
- th:href - The thymeleaf syntax used to define the URL path
- th:src - The thymeleaf syntax used to define the resource path.Usually used to locate pictures, JS imports, etc.
##Thymeleaf Logical Control
if judgment
<span th:if="${attr} == 'value'">
show text
<span>
Branch Judgment
<div th:switch="${attr}">
<span th:case="value1">show text 1</span>
<span th:case="value2">show text 2</span>
<span th:case="value3">show text 3</span>
</div>
Circular List
<!-- Syntax: variable name : ${Collection to cycle attr} Similar java In foreach -->
<tr th:each="u : ${list}">
<td th:text="${u.userid}"></td>
<td th:text="${u.username}"></td>
<td th:text="${u.userage}"></td>
</tr>
Loop Map
Iterate over a Map set. When iterating over a Map, each loop variable type is Map.Entry if the map is iterated over using an iterated linear set.If you want to manipulate the key or value in Map.Entry, you can do a second iteration.In Thymeleaf, think of Map.Entry as a collection
<div th:each="m : ${map}">
<span th:text="${m.key}"></span>
<span th:each="u : ${m.value}" th:text="${u.name}"></span>
</div>
State variables in loops
The state variable is to provide the state basis for the cycle process.For example: circular index, number, count, odd and even number, etc.State variables are common in loop syntax
<!-- Syntax: Loop variable, state variable : ${attr} -->
<tr th:each="u, var : ${list}">
<td th:text="${var.index}"></td><!-- Index, starting at 0 -->
<td th:text="${var.count}"></td><!-- Count, starting from 1 -->
<td th:text="${var.size}"></td><!-- Collection capacity -->
<td th:text="${var.even}"></td><!-- is even -->
<td th:text="${var.odd}"></td><!-- is odd -->
<td th:text="${var.first}"></td><!-- Is it the first element -->
<td th:text="${var.last}"></td><!-- Is it the last element -->
</tr>
Access Scope
<!-- Request -->
<div th:text="${#httpServletRequest.getAttribute('name')}"></div>
<!-- Session -->
<div th:text="${session.userName}"></div>
URL expression
Thymeleaf encode s the request header.Springmvc decode s when processing request header parameters
<a th:href="@{http://www.baidu.com}" th:text="absolute path"></a>
<img th:src="@{/1.jpg}" style="height: 50px"/>
<a th:href="@{/index}">Relative Path-Relative to Root of Application</a>
<a th:href="@{~/index}">Relative Path-Relative to Server Root</a>
<a th:href="@{index}">Relative Path-Relative to Current Path</a>
<a th:href="@{/params(id=1, name=Zhang San)}">Parameter Pass</a>
<a th:href="@{/restfulParams/{id} (id=2, name=Li Si)}">Restful parameter</a>
thymeleaf string operation
<!-- Judgement string is not empty -->
${#strings.isEmpty(str)}
<!-- Whether to include substrings -->
${#strings.contains(all, 'str')}
<!-- Do you start with what -->
${#strings.startsWith(attr, 'pre')}
<!-- Whether or not to end with -->
${#strings.endsWith(attr,'suf')}
<!-- String Length -->
${#strings.length(attr)}
<!-- Find substring index, no return-1 -->
${#strings.indexOf(attr, 'str')}
<!-- substring -->
${#strings.substring(attr,begin[,end])}
<!-- Uppercase -->
${#strings.toUpperCase(attr)}
<!-- To lower case -->
${#strings.toLowerCase(attr)}
thymleaf date operation
<!-- Formatting, default Thymeleaf Is the date formatted using the browser's preferred locale -->
${#dates.format(date)}
${#dates.format(date, 'formatter')}
<!-- Acquire Year -->
${#dates.year(date)}
<!-- Get Months -->
${#dates.month(date)}
<!-- get date -->
${#dates.day(date)}