SpringBoot: 用于视图渲染的第三方模板引擎 ----10

本文介绍了如何在SpringBoot中集成并使用Thymeleaf模板引擎来构建后台管理系统。从引入starter到配置策略,详细讲解了Thymeleaf的基本用法,包括页面跳转、数据渲染、页面公共部分抽取等关键步骤,并提供了登录验证和主页面数据展示的示例代码。强调了Thymeleaf的现代模板引擎特性,以及其在实际开发中的应用。
摘要由CSDN通过智能技术生成

模板引擎 - thymeleaf

sss视图解析:SpringBoot默认不支持 JSP,需要引入第三方模板引擎技术实现页面渲染。我们可以通过springboot文档找到了thymelf模本,因此本次我们以thymelsf为模范进行解析。
在这里插入图片描述

thymeleaf简介

sssThymeleaf is a modern server-side Java template engine for both web and standalone environments, capable of processing HTML, XML, JavaScript, CSS and even plain text. (现代化、服务端Java模板引擎)

sdsss[注]:相关的 thymeleaf 使用,可以去官网查看相关文档,thymeleaf.org。

thymeleaf使用

sss①、首先引入starter

<dependency> 
	<groupId>org.springframework.boot</groupId> 
	<artifactId>spring-boot-starter-thymeleaf</artifactId> 
</dependency>

sss②、springboot自动配置好了thymeleaf

@Configuration(proxyBeanMethods = false) 
@EnableConfigurationProperties(ThymeleafProperties.class) 
@ConditionalOnClass({ TemplateMode.class, SpringTemplateEngine.class }) 
@AutoConfigureAfter({ WebMvcAutoConfiguration.class, WebFluxAutoConfiguration.class }) 
public class ThymeleafAutoConfiguration { }

sss配置策略:

sdsss1、所有thymeleaf的配置值都在 ThymeleafPropertiessdsss2、配置好了 SpringTemplateEngine (模板引擎)

sdsss3、配好了 ThymeleafViewResolver dssss4、我们只需要直接开发页面

在这里插入图片描述

thymeleaf开发示例:

sss①、controller页面
在这里插入图片描述
sss②、页面:
在这里插入图片描述
sdsss[注]:xmlns:th=“http://www.thymeleaf.org” 要声明thymeleaf的方式,也可以说是命名空间。

sdsss[注]:还有就是templates下的所有页面解析,都是经过请求处理,模板引擎解析出来的,直接访问是静态网页。

基本语法

sss表达式:
ssdasdsa在这里插入图片描述

构建后台管理系统

sss①、页面跳转 - 登录页面跳转主页面

@Controller
public class IndexController {

    @GetMapping(value = {"/","/login"})
    public String loginPage(){
    
        /**
         * 来登陆页
         */
        return "login";
    }

    @PostMapping("/login")
    public String main(User1 user, HttpSession session, Model model){

        if(StringUtils.hasLength(user.getUserName()) && "123456".equals(user.getPassword())){
            //把登录成功的用户保存起来
            session.setAttribute("loginUser" , user);
            //登录成功,重定向到main,html,防止页面重复提交
            return "redirect:/main.html";
        }else{
            model.addAttribute("msg" , "账号密码错误");
            //返回登录页
            return "login";
        }
    }

    /**
     * 去main页面
     * @return
     */
    @GetMapping("/main.html")
    public String mainPage(HttpSession session , Model model){
        //是否登录,拦截器,过滤器
        Object loginUser = session.getAttribute("loginUser");
        if(loginUser!=null)
            return "main";
        else{
            //回到登录页面
            model.addAttribute("msg" , "请重登陆");
            return "login";
        }
    }
}

sss【注1】:首先注意重定向的写法,这样的优点比“forward”转发少中转一次。

sss【注2】:我们将数据存储到了Model,因为model的相关数据在request中。

sss②、数据渲染
ssdsdsdsds在这里插入图片描述
sss③、抽取页面公共部分
dsadssddsdsas在这里插入图片描述
sss【注】: th:insert/replace/include,具体看thymeleaf的官方文档。

sss【注】:th:action="@{/login}"

sss④、主页面顶部显示管理员信息
dsadssddsdsas在这里插入图片描述
sss⑤、遍历取出数据
dsadssddsdsas在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值