SpringBoot 12: Thymeleaf template engine

Template engine introduction

Common template engines: JSP, Velocity, Freemarker, Thymeleaf (Recommended by SpringBoot)

 

Execution process: template (Template) + data (Data) ==== give it to the template engine (TemplateEngine) ====out write out

 

Features of Thymeleaf template engine recommended by SpringBoot: simple syntax and more powerful functions

 

SpringBoot Thymeleaf engine template use

1. The introduction of Thymeleaf template engine maven depends on spring-boot-starter-thymeleaf

2. As long as we put the HTML page in classpath:/templates/, thymeleaf can render automatically

3. Thymeleaf syntax

  • Page import xmln:th="http://www.thymeleaf.org"eleaf.org"
  • th:text="${}" 
  • th:href="@{/url}" where @ means http://localhost:port/ project name
  • th:src="@{/url}"

4. After the template engine page is modified during development, it must take effect in real time

  • Disable the cache of the template engine, configure spring.thymeleaf.cache=false in application.properties
  • After the page is modified, ctrl+f9: recompile (IDEA environment)

 

SpringBoot Thymeleaf engine template combat

1. Introduce maven dependency (you can find the start launcher on the SpringBoot official website)

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

2. Write Controller control class (auto-generated SpringBoot)

package com.xue.springbootweb.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.Date;

/**
 * @Description
 * @Author xuexue
 * @Date 2019/9/28 17:25
 */
@Controller
public class TestController {

    @RequestMapping(value = "/login")
    public String toHelloWorld() {
        return "login";
    }

}

3. Create and write login files under templates (templates are automatically rendered by the template engine)

Introduce the head, when writing html, there will be prompt thymeleaf syntax information

xmlns:th="http://www.thymeleaf.org"
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" th:value="我是内容" />
<span th:text="我是范围"></span>
</body>
</html>

operation result

 

 

Guess you like

Origin blog.csdn.net/qq_41055045/article/details/102538523