SpringBoot视图层技术(第三章)

    xiaoxiao2022-07-03  109

    章节介绍;

    整合jsp整合 freemarker整合thymeleaf

    一、整合jsp

    1.创建项目(参考第一章)

    2.修改pom文件,添加坐标

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>08-spring-boot-view-jsp</artifactId> <version>0.0.1-SNAPSHOT</version> <!-- jdk1.7 --> <properties> <java.version>1.7</java.version> </properties> <dependencies> <!-- springBoot 的启动器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- jstl --> <dependency> <groupId>javax.servlet</groupId> <artifactId>jstl</artifactId> </dependency> <!-- jasper --> <dependency> <groupId>org.apache.tomcat.embed</groupId> <artifactId>tomcat-embed-jasper</artifactId> <scope>provided</scope> </dependency> </dependencies> </project>

    3.创建 SpringBoot 全局配置文件 application.properties

    spring.mvc.view.prefix=/WEB-INF/jsp/ spring.mvc.view.suffix=.jsp

    4.创建 Controller

    /** * SpringBoot 整合 jsp * * */ @Controller public class UserController { /* * 处理请求,产生数据 */ @RequestMapping("/showUser") public String showUser(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"张三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); //需要一个 Model 对象 model.addAttribute("list", list); //跳转视图 return "userList"; } }

    5.创建 JSP

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <table border="1" align="center" width="50%"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <c:forEach items="${list }" var="user"> <tr> <td>${user.userid }</td> <td>${user.username }</td> <td>${user.userage }</td> </tr> </c:forEach> </table> </body> </html>

    6.启动类(省略,参考第一章)

    二、整合freemarker

    1.修改pom 坐标

    <!-- freemarker 启动器的坐标 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency>

    2.编写视图

    注意:springBoot 要求模板形式的视图层技术的文件必须要放到 src/main/resources 目录下必 须要一个名称为 templates

    <html> <head> <title>展示用户数据</title> <meta charset="utf-9"></meta> </head> <body> <table border="1" align="center" width="50%"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <#list list as user > <tr> <td>${user.userid}</td> <td>${user.username}</td> <td>${user.userage}</td> </tr> </#list> </table> </body> </html>

    3.创建 Controller 类

    /** * SpringBoot 整合 jsp * * */ @Controller public class UserController { /* * 处理请求,产生数据 */ @RequestMapping("/showUser") public String showUser(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"张三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); //需要一个 Model 对象 model.addAttribute("list", list); //跳转视图 return "userList"; } }

    启动,启动器即可运行。。。

    三、整合thymeleaf

       

    1.创建存放视图的目录

     目录位置:src/main/resources/templates

     templates:该目录是安全的。意味着该目录下的内容是不允许外界直接访问的。

    2. 添加 thymeleaf 坐标

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

    3.thymeleaf的基本使用

       特点:Thymelaef 是通过他特定语法对 html 的标记做渲染。

    4.编写 Controller

    /** * Thymeleaf 入门案例 * * */ @Controller public class DemoController { @RequestMapping("/show") public String showInfo(Model model){ model.addAttribute("msg", "Thymeleaf 第一个案例"); return "index"; } }

    5.创建视图

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Thymeleaf 入门</title> </head> <body> <span th:text="Hello"></span> <hr/> <span th:text="${msg}"></span> </body> </html>

    6.编写启动类(参考第一章 没变化)

    7.版本要求

    Thymeleaf.jar:更新为 3.0 以上的版本

    thymeleaf-layout-dialect.jar:更新为 2.0 以上的版本

    最新回复(0)