thymeleaf fragmentary knowledge points

First, if you use thymeleaf in the SpringBoot project, you must import the corresponding dependencies in the pom.xml file

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

Thymeleaf is for HTML pages. If you want the thymeleaf grammar to be used normally in the page, you must inform the HTML page that the grammar is used in advance.
```
<html lang="en" xmlns:th="http://www.thymeleaf.org">
 该句代码后面的xmlns:th="http://www.thymeleaf.org"就是告知页面使用thymeleaf
```
If you want to turn a certain attribute in the label into a dynamic attribute, add a th:xxx after this attribute, xxx is the name of the dynamic attribute, and then add @ or $ in the double quotation marks and then add the desired change in the braces Content.
```
<label style="color: red" th:text="${msg}"></label>
```

If you add dynamic text to the plain text, you must first add two, and add ${corresponding content} to the slogan

<a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
  <img src="images/photos/user-avatar.png" alt="" />
  [[${session.loginUser.userName}]]
  <span class="caret"></span>
</a>

thymeleaf extracts common code

If you want to extract the code, you must first have a public HTML file to store the repeated HTML code

<head th:fragment="commonheader">
    <meta charset="UTF-8">
    <title>公共页面</title>

    <link href="css/style.css" th:href="@{/css/style.css}" rel="stylesheet">
    <link href="css/style-responsive.css" th:href="@{css/style-responsive.css}" rel="stylesheet">

    <script src="js/html5shiv.js" th:src="@{js/html5shiv.js}"></script>
    <script src="js/respond.min.js" th:src="@{js/respond.min.js}"></script>
</head>

The code in the head tag in the code above is the common code, where th:fragment="commonheader" is to set the head tag as the common code. In addition, you can also add an id attribute to the common code.

Then extract the common code

<div th:include="common :: commonheader"></div>

<div th:replace="common :: #leftmenu"></div>

The above two lines of code are to obtain public code. The two colons before represent public HTML files, and the two colons after represent public tags. The upper one is obtained through th:fragment, and the lower one is through the id selector. Acquired.

thym traversal

                <tr class="gradeX" th:each="user,stats:${users}">
                    <td th:text="${stats.count}"></td>
                    <td th:text="${user.userName}"></td>
                    <td th:text="${user.password}"></td>
                </tr>

The above traversal is to put the content of the traversal into the table
${stored in the array or collection sent from the controller layer}
user is a single element
stats is the status.

thymeleaf fragmentary knowledge points

Guess you like