springboot Thymeleaf模版引擎使用

一上来默认访问templates下面的index页面

1.引入依赖 

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.0.2.RELEASE</version>
		<relativePath/> <!-- lookup parent from repository -->
	</parent>
	<groupId>com.qcby</groupId>
	<artifactId>thymeleaf_demo01</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>thymeleaf_demo01</name>
	<description>Demo project for Spring Boot</description>
	<properties>
		<java.version>18</java.version>
	</properties>
	<dependencies>
		<!--启动的依赖-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
		<!--web相关依赖-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<!--thymeleaf视图引擎-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>
		<!--!&#45;&#45;热部署 ctrl+f9热部署&ndash;&gt;-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-devtools</artifactId>
			<optional>true</optional>
		</dependency>
		<!--&lt;!&ndash;lombok插件&ndash;&gt;-->
		<dependency>
			<groupId>org.projectlombok</groupId>
			<artifactId>lombok</artifactId>
			<optional>true</optional>
		</dependency>
		<!--<!‐‐导入配置文件处理器,配置文件进行绑定就会有提示‐‐>-->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-configuration-processor</artifactId>
			<optional>true</optional>
		</dependency>
		<!--<!‐‐引入jquery‐webjar‐‐>在访问静态资源的时候只需要写webjars下面资源的名称即可-->
		<dependency>
			<groupId>org.webjars</groupId>
			<artifactId>jquery</artifactId>
			<version>3.3.1</version>
		</dependency>
		<!--fastjson消息转化器,使得前端传来的数据转成java可以解析的数据-->
		<dependency>
			<groupId>com.alibaba</groupId>
			<artifactId>fastjson</artifactId>
			<version>1.2.47</version>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<!--这个插件支持maven将项目打包成jar包 java -jar运行-->
				<plugin>
					<groupId>org.springframework.boot</groupId>
					<artifactId>spring-boot-maven-plugin</artifactId>
				</plugin>
			<!--<plugin>-->
				<!--<groupId>org.springframework.boot</groupId>-->
				<!--<artifactId>spring-boot-maven-plugin</artifactId>-->
				<!--<configuration>-->
					<!--<excludes>-->
						<!--<exclude>-->
							<!--<groupId>org.projectlombok</groupId>-->
							<!--<artifactId>lombok</artifactId>-->
						<!--</exclude>-->
					<!--</excludes>-->
				<!--</configuration>-->
			<!--</plugin>-->
		</plugins>
	</build>
</project>

2.html 

 html中要声明约束,这样就可以使用themelraf视图引擎了

<html lang="en" xmlns:th="http://www.thymeleaf.org">

html:

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--链接、引用需要用@{},下面演示引入js和css-->
<!--<link rel="stylesheet" th:href="@{index.css}">-->
<!--<script type="text/javascript" th:src="@{index.js}"></script>-->
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
超链接
<div><a th:href="@{https://www.baidu.com/}">点击跳转百度!</a></div>
1.普通字符
<div th:text="${name}"></div>
2.JavaBean对象
<table bgcolor="#ffe4c4" border="1">
    <tr>
        <td>介绍</td>
        <td th:text="${user.name}"></td>
    </tr>
    <tr>
        <td>年龄</td>
        <td th:text="${user['age']}"></td>
    </tr>
    <tr>
        <td>性别</td>
        <td th:text="${user.getAge()}"></td>
    </tr>
</table>
3.list集合
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${list}">
        <td th:text="${item.name}"></td>
        <td th:text="${item.age}"></td>
        <td th:text="${item.sex}"></td>
    </tr>
</table>
4.map
<table bgcolor="#ffe4c4" border="1">
    <tr th:each="item:${map}">
        <td th:text="${item.key}"></td>
        <td th:text="${item.value.sex}"></td>
    </tr>
</table>
5.*使用
<div th:object="${user}">
    <p>Name: <span th:text="*{name}"></span>.</p>
    <p>Age: <span th:text="*{age}"></span>.</p>
    <p>sex: <span th:text="*{sex}"></span>.</p>
</div>
6.#直接从配置文件读取
<table bgcolor="#ffe4c4" border="1">
    <tr>
        <td>name</td>
        <td th:text="#{perspn.name}"></td>
    </tr>
    <tr>
        <td>年龄</td>
        <td th:text="#{person.age}"></td>
    </tr>
    <tr>
        <td>性别</td>
        <td th:text="#{person.sex}"></td>
    </tr>
</table>
</body>
</html>

 User实体类:

package com.qcby.thymeleaf_demo01.pojo;
public class User {
    public String name;
    public Integer age;
    public Character sex;

    public User(String name, Integer age, Character sex) {
        this.name = name;
        this.age = age;
        this.sex = sex;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }

    public Character getSex() {
        return sex;
    }

    public void setSex(Character sex) {
        this.sex = sex;
    }


}

 Comtroller:

import com.qcby.thymeleaf_demo01.pojo.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
public class urlController {
    @GetMapping("demo")//页面的url地址
    public String demo(Model model)//对应函数
    {
        User user1=new User("hhh",15,'女');
        User user2=new User("xxx",18,'女');
        User user3=new User("qqq",19,'女');
        List<User> list=new ArrayList<>();
        list.add(user1);
        list.add(user2);
        list.add(user3);
        Map<String ,User> map=new HashMap<>();
        map.put("hhh",user1);
        map.put("xxx",user2);
        map.put("qqq",user3);
        //数据添加到model中
        model.addAttribute("name","nihao");//普通字符串
        model.addAttribute("user",user1);//javabean
        model.addAttribute("list",list);//list
        model.addAttribute("map",map);//Map
        return "success";
    }
}

在直接读取properties文件的内容时:要springboot的配置文件声明路径

application.properties:

#直接读取配置文件
spring.messages.basename=templates/temp

 temp.properties文件:

perspn.name=超级飞侠
person.age=15
person.sex=男

  • 4
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值