springboot uses thmeleaf as a template

jsp obviously can't keep up with the development of the times. Is freemarker enough? Try thymeleaf instead. The official recommendation of springboot is freemarker and thymeleaf. Compared with freemarker, thymeleaf is more powerful. It can dynamically replace the static content in the tag, so that the front end can write the page at ease, and the back end can roll up the interface at ease, just need to replace the variables. This idea, I don't know if VUE copied thymeleaf or thymeleaf copied VUE, but It doesn't matter. For our vast number of code slaves, it's better to be practical

I. pom introduction

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

II. application.properties add thmeleaf configuration

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

III. html compilation

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
                xmlns:th="http://www.thymeleaf.org">
<head>
    <title>demo</title>
</head>
<body>
<p>This is the first paragraph</p>
<p th:text="${textValue}">This is the second paragraph</p>
</body>
</html>

IV. test

package com.mos.easyboot.admin.controller;


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

@Controller
@RequestMapping("demo")
public class DemoController {


    @RequestMapping("index")
    public String index(Model model){
        String textValue = "If the sergeant hears the word, he can only do it; if the sergeant hears the word, he will die; if the sergeant hears the word, he will laugh." +
                "Not to laugh is not enough." +
                "Therefore, there are some suggestions: if the road is clear, if the road is backward, if the road is barbaric, if the road is backward( lei);The great form has no shape. Great sound is hard to hear. If Guangde is not enough, if Jiande steal, it will be truly generous." +
                "Tao Yin is nameless." +
                "The only way is to start well and accomplish well.";
        model.addAttribute("textValue",textValue);
        return "demo/demo";
    }
}

V. page effect

4.png

Land, data rendering

VUE has a headache about SSR (server-side rendering), although there are solutions (see my previous article< Separating Nuxt.js from the front and back to solve the SEO problem >), but I always think it's better to let the right technology do the business, while thmeleaf is equivalent to rendering on the server. The source code of the page is as follows:

5.png

Tags: Thymeleaf Spring FreeMarker Vue

Posted on Thu, 30 Apr 2020 21:10:38 -0700 by swissmissflash