详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎

2023-09-23 07:47:05 53

序言：

Thymeleaf是Java服务端的模板引擎，与传统的JSP不同，前者可以使用浏览器直接打开，因为可以忽略掉拓展属性，相当于打开原生页面，给前端人员也带来一定的便利。如果你已经厌倦了JSP+JSTL的组合，Thymeleaf或许是个不错的选择！本工程传送门：SpringBoot-Web-Thymeleaf

开始使用

1.引入依赖

SpringBoot默认提供了Thymeleaf的Starter，只需简单引入依赖即可。


org.springframework.boot
spring-boot-starter-thymeleaf

目前默认版本是2.1，如果想升级版本到3.0，可以这样修改。


3.0.7.RELEASE
2.0.0

为了方便开发，项目案例采用了热部署工具dev-tools，这样我们在修改页面之后，IDEA会自动加载，从而达到实现热更新的效果。


org.springframework.boot
spring-boot-devtools
runtime

注：由于IDEA默认关闭了热部署，需要做一些设置才能使其生效。解决方法：首先按住Ctrl+Shift+Alt+/然后进入Registry，然后勾选compiler.automake.allow.when.app.running即可。另外，Build->Compiler也要勾选上BuildProjectautomatically.

2.添加相关配置

Thymeleaf默认开启了页面缓存，在开发的时候，应该关闭缓存。此外，通常我们还会指定页面的存放路径。（默认是classpath:/templates/）

application.yml配置如下：
spring:
thymeleaf:
cache:false#关闭缓存
prefix:classpath:/views/#添加路径前缀

3.编写HTML

编写Thymeleaf和书写HTML5页面没有什么不同，最大的转变就是使用拓展属性（th:xx）去跟服务端进行数据交互，保留原始页面风格，也是Thymeleaf的推崇的风格。例如下面这个简单的案例，启动项目，我们发现页面跳转的是简书的连接，这一点也验证了Thymeleaf覆盖原生页面数据的极佳能力。

页面代码：




Thymeleaf


欢迎使用Thymeleaf!!
戳我有惊喜

后端代码：

@Controller
publicclassUserController{

@GetMapping("/")
publicStringindex(Modelmodel){
model.addAttribute("info","user/list");
return"index";
}

@GetMapping("/user")
publicStringhehe(Modelmodel){
model.addAttribute("user",newUser(UUID.randomUUID().toString(),"yizhiwazi","20170928"));
return"user";
}

@GetMapping("/user/list")
publicStringuserlist(Modelmodel){
ListuserList=newArrayList<>();
userList.add(newUser(UUID.randomUUID().toString(),"yizhiwazi","20170928"));
userList.add(newUser(UUID.randomUUID().toString(),"kumamon","123456"));
userList.add(newUser(UUID.randomUUID().toString(),"admin","admin"));
model.addAttribute("userList",userList);
return"userList";
}

}

现在我们尝试回填一个表单，展示单个用户信息。

接下来，我们进入一个更复杂的案例，例如展示一个用户列表信息，不需要编写新的标签，就可以完成对批量用户的遍历。

用户列表



用户姓名：
登录密码：

好了，Thymeleaf简单介绍到这里，更多详细说明，可阅读Thymeleaf官方指南3.0

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

详解SpringBoot+Thymeleaf 基于HTML5的现代模板引擎

欢迎使用Thymeleaf!!

用户列表

热门推荐

随机推荐