SpringBoot-03-Web

最新推荐文章于 2024-09-14 09:14:48 发布

阿国GG在学习

最新推荐文章于 2024-09-14 09:14:48 发布

阅读量316

点赞数

分类专栏： SpringBoot 文章标签： spring boot 前端 java

本文链接：https://blog.csdn.net/weixin_46147113/article/details/121868212

版权

SpringBoot 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

一、静态资源

1. 咋Spring Boot，我们可以用一下方式处理静态资源

webjars 访问： localhost:8080/webjars/ (基本不用)

public、 static、 /**、 resources

访问：localhost:8080/webjars/

2. 优先级： resources> static:默认>public

二、thymeleaf

maven依赖

        <dependency>
            <groupId>org.thymeleaf</groupId>
            <artifactId>thymeleaf-spring5</artifactId>
        </dependency>
        <dependency>
            <groupId>org.thymeleaf.extras</groupId>
            <artifactId>thymeleaf-extras-java8time</artifactId>
        </dependency>

控制层、路径映射

  @RequestMapping("/test")
    public String hello(Model model){
        model.addAttribute("msg","<h1>你好阿</h2>");
        model.addAttribute("color","color:red");
        model.addAttribute("users", Arrays.asList("张三","李四","王二狗"));


        return "aaa";
    }

html代码

th命名空间引用：xmlns:th="http://www.thymeleaf.org"

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>首页</h1>
<!---->
<!--所有的html元素都可以被thymeleaf替换接管：th:元素名-->
<div th:text="${msg}"></div>            <!--不识别-->
<div th:utext="${msg}"></div>           <!--识别-->
=======================================
<h3 th:style="${color}">哈哈哈</h3>
=======================================
<!--两种遍历方式-->
<h3 th:each="user:${users}" th:text="${user}"></h3>
=======================================
<h3 th:each="user:${users}" >[[${user}]]</h3>




</body>
</html>

测试结果

三、themeleaf语法

1. 赋值

model.addAttribute("msg","<h1>你好阿</h2>");

<!--所有的html元素都可以被thymeleaf替换接管：th:元素名-->
<div th:text="${msg}"></div>            <!--不识别-->
<div th:utext="${msg}"></div>           <!--识别-->

2. 样式

model.addAttribute("color","color:red");

<h3 th:style="${color}">哈哈哈</h3>

3. 遍历

model.addAttribute("msg","<h1>你好阿</h2>");

<!--两种遍历方式-->
<h3 th:each="user:${users}" th:text="${user}"></h3>
=======================================
<h3 th:each="user:${users}" >[[${user}]]</h3>