商品详细页面（item项目的创建和thymeleaf的引入）

最新推荐文章于 2022-11-07 08:27:51 发布

Hiber12

最新推荐文章于 2022-11-07 08:27:51 发布

阅读量444

点赞数

本文链接：https://blog.csdn.net/Hiber12/article/details/108632470

版权

1 创建一个item-web的商品详情工程
2 配置item-web，pom，properites文件
3 引入thymeleaf的依赖，thymeleaf是springboot的原生渲染模板，只需要在web通用依赖加入即可，版本号默认跟随boot，是boot的亲儿子，不需要到父依赖添加版本，它使用的是html的扩展标签：
在这里插入图片描述
Jsp是一个html代码+java代码的混合界面，所以即可以写html的标签，又可以写jsp标签（c:foreach循环标签、c:if条件标签），value取值,取值标签

thymeleaf用的是html模板，html是属于静态页面，原生的代码是没有这些标签的。所以Spring boot在html上加上扩展标签，thymeleaf自主定义自己的标签。

4实现这个扩展标签，就需要在html页面上声明thymeleaf的模板约束

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

有了约束，就变成thymeleaf模块。没有的话，就是一个普通的静态html模块。

5、html不允许一丁点的错误，一个斜杆/错误都会报500错误，校验特别严格！
而jsp中语法有错误，也会照样显示
6、代码测试一下thymeleaf的扩展标签：

@Controller
public class ItemController {

    @RequestMapping("index")
    public String index(ModelMap modelMap){

        modelMap.put("hello","hello html");//key和value
        return "index";
    }
}

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
</head>
<body>
 sdafasfas
    <br/>
{hello}
<p th:text="${hello}"></p>
</body>
</html>

在这里插入图片描述
7、设置松校验（允许某些标签少一点一斜杆等的错误）和热部署（修改html页面的代码，快捷键Shift+Ctrl+F9提交，刷新页面就可以实时看到页面变化了，无需重启服务器！）

8、在gmall-web-util里加入以下依赖：

<dependencies>
    <dependency>
        <!--通用的util，要引入-->
        <groupId>com.atguigu.gmall</groupId>
        <artifactId>gmall-common-util</artifactId>
        <version>1.0-SNAPSHOT</version>
    </dependency>

    <!--spring boot 的亲儿子，自动跟随boot的版本号，无需在父依赖parent添加-->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

    <!--thymeleaf的支持包，可以设置松校验、热部署-->
    <dependency>
        <groupId>net.sourceforge.nekohtml</groupId>
        <artifactId>nekohtml</artifactId>
    </dependency>
    <dependency>
        <groupId>xml-apis</groupId>
        <artifactId>xml-apis</artifactId>
    </dependency>
    <dependency>
        <groupId>org.apache.xmlgraphics</groupId>
        <artifactId>batik-ext</artifactId>
    </dependency>

</dependencies>

9、在properties文件加入：

# 关闭thymeleaf的缓存（热部署）
spring.thymeleaf.cache=false

# 松校验
spring.thymeleaf.mode=LEGACYHTML5

LEGACY
legacy遗产，即是继承的意思。
松校验，LEGACYHTML5的意思是继承html5