如何配置Thymeleaf教程，及Thymeleaf的简单使用教程【一篇足够入门】

第一步【进行maven项目的建立（maven的建立前面文章中有提过），建立完之后在pom.xml中进行相关包的导入跟配置】

建立好的项目结构大致如下所示

项目建好之后打开pom.xml进行配置，在里面增加以下内容

<!-- 配置 Springboot 依赖-->
<parent><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><version>2.1.6.RELEASE</version>
</parent>
<dependencies><!-- 配置 SpringMVC 依赖 --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><!-- 引入freeMarker的依赖包. --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-freemarker</artifactId></dependency><!-- mybatis 依赖 --><dependency><groupId>org.mybatis.spring.boot</groupId><artifactId>mybatis-spring-boot-starter</artifactId><version>1.1.1</version></dependency><!-- mysql 依赖 --><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.45</version></dependency><!-- thymeleaf 依赖 --><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency></dependencies>

加完之后进行导包，导包成功进行第二步

第二步【在src目录下的resources下面新增如下文件夹跟文件】

第三步【进行application.properties的配置】

要根据自己的数据库配置进行配置

#mysql
spring.datasource.url=jdbc:mysql://localhost:3306/test?characterEncoding=UTF-8
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=com.mysql.jdbc.Driver#配置thymeleaf
spring.thymeleaf.cache=falsespring.freemarker.template-loader-path=classpath:/templates/
#mybatis隐射文件路径
#mybatis.mapper-locations=classpath:mapper/*.xml
#实体类别名<select id="list" resultType="Book">
#mybatis.type-aliases-package=com.web.entity

配置完了之后进行第四步

第四步【进行文件的目录结构设计】

static文件夹中存放静态的文件，包括静态网页，css,js,图片等

在templates下存放与后台有交互的网页

第五步【thymeleaf】如何与后台进行交互

html下的网页格式【根据网页中的相关交互进行模仿】

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" type="text/css" th:href="@{css/mystyle.css}"/><script type="text/javascript" th:src="@{js/myscript.js}"></script><script th:inline="javascript">function test(){//在JavaScript获取请求对象绑定的数据var username = [[${username}]];alert(username);}</script>
</head>
<body><img th:src="@{image/mmexport1599813548353.jpg}" width="300px" onclick="fun()"/><h1 th:text="${username}">lifan</h1><h1 th:if="${username==null}">登录，注册</h1><h1 th:if="${username!=null}"><span th:text="${username}"></span></h1><div th:switch="${user.role}"><p th:case="admin">管理员</p><p th:case="user">普通用户</p><p th:case="guest">游客</p></div><input type="text" th:value="${user.username}"/><input type="password" th:value="${user.username}"/><input type="button" value="按钮" onclick="test()"/><table border="1" width="60%"><tr><th>账户</th><th>密码</th><th>角色</th><th>角色</th></tr><tr th:each="u:${list}" align="center"><td th:text="${u.username}">lifan</td><td th:text="${u.password}">123456</td><td th:text="${u.role}">admin</td><td><a>修改</a><a th:href="${'delete?username='}+${u.username}">删除</a><a th:href="@{'delete?username='+${u.username}}">删除</a><a th:href="@{delete(username=${u.username},password=${u.password})}">删除</a></td></tr></table>
</body>
</html><a th:href="@{addinit}">新增</a>
<table border="1" width="60%"><tr><th>账户id</th><th>账户</th><th>密码</th><th>真实姓名</th><th>年龄</th><th>性别</th>><th>角色</th></tr><tr th:each="u:${list}" align="center"><td th:text="${u.uid}">1</td><td th:text="${u.uname}">limaodong</td><td th:text="${u.upwd}">123456</td><td th:text="${u.rname}">李茂东</td><td th:text="${u.age}">12</td><td th:text="${u.role}">admin</td><td><a>修改</a><a th:href="@{delete(username=${u.uid})}">删除</a></td></tr>
</table></body>

【重点】这里要注意

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

这个地方一定要写这样，不然thymeleaf用不了

Controller相关代码

package com.web.controller;import com.web.entity.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;import javax.servlet.http.HttpServletRequest;
import java.util.ArrayList;
import java.util.List;/*** 默认访问首页的控制器*/
@Controller
public class IndexController {//配置不需要输入网页请求地址直接访问首页@RequestMapping("/")public String index(HttpServletRequest request){request.setAttribute("username","admin");request.setAttribute("user",new User("zhangsan","123456","guest"));List<User> list = new ArrayList<>();list.add(new User("zhangsan1","123456","guest"));list.add(new User("zhangsan2","123456","admin"));list.add(new User("zhangsan3","123456","user"));list.add(new User("zhangsan4","123456","user"));request.setAttribute("list",list);return "index";}@RequestMapping("/delete")public String delete(User u){System.out.println(u);return "redirect:/";}}

这里的控制页面跟springboot项目大同小异，基本上一样的

第六步【重点中的重点，觉得有用的一键三连哦！如果不会的可以私信我，手把手的教】

如何配置Thymeleaf教程，及Thymeleaf的简单使用教程【一篇足够入门】相关推荐

配置JDK环境变量（最简单手把手教程）
目录简介 JDK卸载准备JDK 环境配置校检配置简介本文博客只为自己记忆,就新手最简单手把手教程 JRE(Java Runtime Environment ) Java运行环境,用来运行JA ...
android导航使用教程,android BottomNavigationView的简单使用教程
每个android app都有BottomNavigationView导航,本人开发中刚刚使用到了BottomNavigationView,于是按照android developer官网特意做了一个符 ...
XShell6（配置XFTP 文件传输）安装+简单使用教程
资源下载: 百度网盘: 链接:https://pan.baidu.com/s/1W2rum00pS6eig8WLONgjgQ 提取码:jaxq 安装: 下载安装包,双击安装: 点击下一步: 选择接受协 ...
thymeleaf表达式优先级及表达式简单说明
thymeleaf表达式优先级: 表达式简单说明: th:insert 片段包含 th:replace 片段替换 th:each 遍历 th:if 条件判断 th:unless th:switch t ...
乐优商城 Day 09（thymeleaf,Rabbitmq,商品详情页，非教程）
乐优商城学习Day09: 注意:此次代码都是在第八天的基础上第八天的链接如下: https://blog.csdn.net/zcylxzyh/article/details/100859210 此次 ...
PHP在WPS中的应用,PHP+Laravel的简单应用教程【ajax的使用】,wps的使用教程
PHP+Laravel的简单应用教程[ajax的使用]PHP·拉弗尔的简单应用教程[阿贾克斯的使用],下面由Laravel框架教程栏目给大家介绍PHP Laravel的简单应用教程[阿贾克斯的使用], ...
kindle的xray怎么用_Xray简单使用教程
Xray简单使用教程 0X00下载 xray 为单文件二进制文件,无依赖,也无需安装,下载后直接使用. 下载地址为: 注意: 不要直接 clone 仓库,xray 并不开源,仓库内不含源代码,直接下载 ...
mysql2008使用教程_sqlserver2008简单使用教程
本文为大家分享了SQL Server 2008R2简单使用教程,小编今日就带来了sqlserver2008简单使用教程,一起好好学习下吧!,具体内容如下 sqlserver2008简单使用教程 1 首 ...
php+larvael,PHP+Laravel的简单应用教程【ajax的使用】
下面由Laravel框架教程栏目给大家介绍PHP+Laravel的简单应用教程[ajax的使用],希望对需要的朋友有所帮助! 声明本文只是零散的应用教程,默认 Laravel 项目已经安装完成,并正 ...

如何配置Thymeleaf教程，及Thymeleaf的简单使用教程【一篇足够入门】

如何配置Thymeleaf教程，及Thymeleaf的简单使用教程【一篇足够入门】

第一步【进行maven项目的建立（maven的建立前面文章中有提过），建立完之后在pom.xml中进行相关包的导入跟配置】

加完之后进行导包，导包成功进行第二步

第二步【在src目录下的resources下面新增如下文件夹跟文件】

第三步【进行application.properties的配置】

要根据自己的数据库配置进行配置

第四步【进行文件的目录结构设计】

第五步【thymeleaf】如何与后台进行交互

html下的网页格式【根据网页中的相关交互进行模仿】

这里的控制页面跟springboot项目大同小异，基本上一样的

如何配置Thymeleaf教程，及Thymeleaf的简单使用教程【一篇足够入门】相关推荐

最新文章

热门文章