如何用thymeleaf设计导航栏模板页面
时间: 2024-04-30 18:24:30 浏览: 71
基于springboot+layui+thymeleaf的学生成绩管理系统设计与实现(适合课程设计作业、毕设参考).zip
Thymeleaf是一个流行的模板引擎,它可以与Spring框架很好地集成。下面是一个简单的示例,演示如何使用Thymeleaf设计导航栏模板页面:
1. 创建一个名为 "nav.html" 的模板文件,并在其中添加以下代码:
```
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
```
2. 在需要使用导航栏的页面中,使用以下代码来包含模板:
```
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>My Page</title>
</head>
<body>
<div th:replace="nav :: nav"></div>
<h1>Welcome to my page</h1>
<!-- rest of the page content -->
</body>
</html>
```
这里的 "nav" 是模板文件名, "::" 符号表示使用片段选择器,"nav" 表示片段名。这个代码会将 "nav.html" 文件中的导航栏插入到页面中。
3. 在Spring Boot应用程序中,可以使用以下代码来配置Thymeleaf:
```java
@Configuration
public class ThymeleafConfig {
@Bean
public ClassLoaderTemplateResolver templateResolver(){
ClassLoaderTemplateResolver templateResolver = new ClassLoaderTemplateResolver();
templateResolver.setPrefix("templates/");
templateResolver.setSuffix(".html");
templateResolver.setTemplateMode("HTML");
return templateResolver;
}
@Bean
public SpringTemplateEngine templateEngine(){
SpringTemplateEngine templateEngine = new SpringTemplateEngine();
templateEngine.setTemplateResolver(templateResolver());
return templateEngine;
}
@Bean
public ThymeleafViewResolver viewResolver(){
ThymeleafViewResolver viewResolver = new ThymeleafViewResolver();
viewResolver.setTemplateEngine(templateEngine());
return viewResolver;
}
}
```
这里的 "templates/" 是你的模板文件所在的相对路径,可以根据自己的需要进行修改。
以上就是使用Thymeleaf设计导航栏模板页面的基本步骤。
阅读全文