二、博客系统,Spring Boot + ThymeLeaf 模板

ThymeLeaf 官网:https://www.thymeleaf.org/

一、ThymeLeaf 介绍

Thymeleaf is a modern server-side Java template engine for both web and standalone environments.

Thymeleaf's main goal is to bring elegant natural templates to your development workflow --- HTML that can be correctly displayed in browsers and also work as static prototypes, allowing for stronger collaboration in development teams.

With modules for Spring Framework, a host of integrations with your favourite tools, and the ability to plug in your own functionality, Thymeleaf is ideal for modern-day HTML5 JVM web development --- although there is much more it can do.

thymxml 是一个面向 web 和独立环境的现代服务器端 Java 模板引擎。

thymfor 的主要目标是为您的开发工作流程带来优雅的自然模板 ------ 可以在浏览器中正确显示的 HTML,也可以作为静态原型,从而在开发团队中进行更强的协作。

有了 Spring 框架的模块,与您最喜欢的工具的集成,以及插入您自己的功能的能力,thymluf 是现代 HTML5 JVM web 开发的理想选择 ------ 尽管它可以做的更多。

Natural templates

HTML templates written in Thymeleaf still look and work like HTML, letting the actual templates that are run in your application keep working as useful design artifacts.

在 Thymeleaf 编写的 HTML 模板可以像 HTML 一样运行,让自然模板在你的应用中使用是非常有用的设计。

Integrations galore

Eclipse, IntelliJ IDEA, Spring, Play, even the up-and-coming Model-View-Controller API for Java EE 8. Write Thymeleaf in your favourite tools, using your favourite web-development framework.

可以使用你喜欢的工具和框架 Eclipse, IntelliJ IDEA, Spring, Play, 甚至 Model-View-Controller API for Java EE 8 来写 Thymeleaf。

二、ThymeLeaf 应用

  1. 创建 SpringBoot 项目, 选择 Thymeleaf 和 Web 依赖
    324647e8d19c465d9ed63e6f7bd2f049_QQ20180716192924.jpg

fd6616e74b4e4f13bd794010494d5f66_QQ20180716193436.jpg

  1. 创建 UserController 和 User 类
    ed73e50283e944068b1890673d22ce6d_QQ20180716211234.jpg
package com.pigplay.demo.controller;

import java.util.ArrayList;
import java.util.List;

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

import com.pigplay.demo.model.User;

@Controller
@RequestMapping("/user")
public class UserController {
	
	@RequestMapping("/list")
    public String  listUser(Model model) {
        List<User> userList = new ArrayList<User>();
        for (int i = 0; i <10; i++) {
            userList.add(new User(i, "zhangsan" + i, "123456" + i));
        }
        
        model.addAttribute("userList", userList);
        return "/user/list";
    }
}


package com.pigplay.demo.model;

public class User {
	private Integer id;
	private String userName;
	private String passWord;
	
	public User(Integer id, String userName, String passWord) {
		super();
		this.id = id;
		this.userName = userName;
		this.passWord = passWord;
	}
	
	public User(){};
	public Integer getId() {
		return id;
	}
	public void setId(Integer id) {
		this.id = id;
	}
	public String getUserName() {
		return userName;
	}
	public void setUserName(String userName) {
		this.userName = userName;
	}
	public String getPassWord() {
		return passWord;
	}
	public void setPassWord(String passWord) {
		this.passWord = passWord;
	}
}


  1. 创建 ThymeLeaf 模板
    54adba3c8f644432b36ee3e7b3b9aa5e_QQ20180716211536.jpg
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title>Insert title here</title>
</head>
<body>
  <h1>用户列表</h1>
  <div>
     <ul>
      <li>
             <span>id</span>-
             <span>用户名</span>-
             <span>密码</span>
         </li>
         
         <li th:each="user:${userList}">
             <span th:text="${user.id}"></span>-
             <span th:text="${user.userName}"></span>-
             <span th:text="${user.passWord}"></span>
         </li>
     </ul>
   </div>
</body>
</html>
  1. 覆盖 ThymeLeaf 的默认配置
    51646d2b196748b5ab59d22f8373ae06_QQ20180716211724.jpg
#thymelea模板配置,禁用缓存
spring.thymeleaf.cache=false

  1. 启动工程
    a61940dfad0c46e0a3dbd1bacd0c7b5e_QQ20180716211852.jpg

  2. 浏览器中输入http://127.0.0.1:8080/user/list
    35cbcb7fadbf41339b5e008159c387cc_QQ20180716211947.jpg

作者:8595250
原创链接: 二、博客系统,Spring Boot + ThymeLeaf 模板
来源:猪玩派
码云:博客 demo