第三章Spring Boot集成视图层

最新推荐文章于 2022-07-20 17:49:32 发布

比笨鸟还菜

最新推荐文章于 2022-07-20 17:49:32 发布

阅读量388

点赞数

分类专栏： Spring Boot

本文链接：https://blog.csdn.net/llg277319314/article/details/88971587

版权

Spring Boot 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

1 概述

本章节主要讲述如何使用Spring Boot集成jsp、freemarker、thymeleaf视图层技术，并着重介绍thymeleaf相关语法

2 集成JSP

2.1 创建maven项目

在这里插入图片描述

2.2 修改jdk版本

SpringBoot 2.0以后的版本使用的是jdk 1.8.
SpringBoot 2.0 以前的版本使用jdk1.7
可以通过修改pom文件来修改jdk版本
在这里插入图片描述

2.3 添加Spring Boot启动器及jsp相关依赖

在这里插入图片描述

2.4 创建Spring Boot配置文件

在这里插入图片描述

2.5 创建Controller

package com.liulg.controller;

import java.util.ArrayList;
import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.liulg.pojo.Info;

@Controller
public class InfoController {
	@RequestMapping("show")
	public String showInfo(Model model){
		List<Info> list = new ArrayList<>();
		list.add(new Info(1,"abc","a'"));
		list.add(new Info(2,"def","d'"));
		list.add(new Info(3,"ghi","g'"));
		model.addAttribute("list", list);
		return "showList";
	}
}

2.6 创建jsp页面

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ 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=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
	<table>
		<c:forEach items="${list }" var ="info">
			<tr><td>${info.id}</td><td>${info.name}</td><td>${info.type}</td></tr>
		</c:forEach>
	</table>
</body>
</html>

2.7 创建启动类

package com.liulg;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class Application {

	public static void main(String[] args) {
		SpringApplication.run(Application.class, args);
	}
}

2.8 运行结果

在这里插入图片描述

3 集成Freemarker

3.1 创建maven项目

在这里插入图片描述

3.2 添加Spring Boot启动器和Freemarker依赖

在这里插入图片描述

3.3 创建视图

注意：Spring Boot规定模板形式的视图层文件必须放到src/main/resources/templates文件夹下，templates文件夹为手动创建，不能该更文件夹名称。

freemarker模板文件的后缀名为.ftl

<html>
	<head>
		<title>展示数据</title>
		<meta charset="utf-8"></meta>
	</head>
	<body>
		<table>
			<#list list as info>
				<tr><td>${info.id}</td><td>${info.name}</td><td>${info.type}</td></tr>
			</#list>
		</table>
	</body>
</html>

3.4 创建Controller

package com.liulg.controller;

import java.util.ArrayList;
import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.liulg.pojo.Info;

@Controller
public class InfoController {
	@RequestMapping("show")
	public String showInfo(Model model){
		List<Info> list = new ArrayList<>();
		list.add(new Info(1,"第一","一"));
		list.add(new Info(2,"第二","二"));
		list.add(new Info(3,"第三","三"));
		model.addAttribute("list", list);
		return "showList";
	}
}

3.5 创建启动类

package com.liulg;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class Application {

	public static void main(String[] args) {
		SpringApplication.run(Application.class, args);
	}

}

3.6 运行结果

在这里插入图片描述

4 集成Thymeleaf

4.1 创建maven项目

在这里插入图片描述

4.2 添加Spring Boot启动器及Thymeleaf依赖

在这里插入图片描述

4.3 创建Controller

package com.liulg.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class TestController {
	@RequestMapping("show")
	public String showInfo(Model model){
		model.addAttribute("msg","Hello World");
		return "index";
	}
}

4.4 创建视图

创建src/main/resources/templates文件夹。
注意：该目录是安全的，该目录下的内容不允许直接访问。因为该目录下的模板文件必须经过数据渲染后才能展示。

Thymeleaf是通过特定语法对html的标记做渲染，所以thymeleaf文件的后缀名称是html

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

4.5 运行结果及注意事项

在本地运行时，能够进入到Controller，但是一直无法跳转到页面，显示404错误，后来在另一台机子上，清除本地maven库之后，重新运行，就可以正常跳转了。根据网上的资料显示，SpringBoot 1.x没有这个问题，这个问题是SpringBoot2.x内部集成Thymeleaf导致的，解决办法就是清除本地maven库。

4.6 常用基本语法介绍

th:text 在页面中输出值
th:value 将值赋值给input标签的value属性
${#strings.isEmpty(key)} 判断字符串是否为空，为空返回true，否则返回fasle
${#strings.contains(str,’T’)} 判断字符串是否包含指定子串，包含返回true，否则返回false
${#strings.startWith(str,’T’)} 判断字符串是否以子串开头
${#strings.endWith(str,’T’)} 判断字符串是否以子串结尾
${#strings.length(str)} 返回字符串长度
${#strings.indexOf(str,’T’)} 查找子串的位置，并返回子串的下标，如果没有找到返回-1
${#strings.subString(str,start)} 从下标13开始截取字符串
${#strings.subString(str,start,end)} 从下标13开始截取到下标15之前，包含13不包含15.
${#strings.toUpperCase(str)} 将字符串转成大写
${#strings.toLoweCase(str)} 将字符串转成小写
${#dates.format(key)} 格式化日期，以浏览器默认语言为格式标准
${#dates.format(key,’yyyy/MM/dd’)} 按照给定的格式格式化日期
${#dates.year(key)} 取年
${#dates.month(key)} 取月
${#dates.day(key)} 取日

4.7 条件判断

4.7.1 th:if

	<span th:if="${sex}=='男'">
		性别：男
	</span>
	<span th:if="${sex}=='女'">
		性别：女
	</span>

4.7.2 th:switch

<div th:switch="${id}">
	<span th:case="1">ID为1</span>
	<span th:case="2">ID为2</span>
	<span th:case="3">ID为3</span>
</div>

4.8 迭代遍历

4.8.1 th:each迭代List

package com.liulg.controller;

import java.util.ArrayList;
import java.util.List;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.liulg.pojo.Info;

@Controller
public class UserController {
	@RequestMapping("show")
	public String showInfo(Model model){
		List<Info> list = new ArrayList<>();
		list.add(new Info(1,"第一","一"));
		list.add(new Info(2,"第二","二"));
		list.add(new Info(3,"第三","三"));
		model.addAttribute("list", list);
		return "showList";
	}
}

<table>
	<tr th:each="info : ${list}">
		<td th:text="${info.id}"></td>
		<td th:text="${info.name}"></td>
		<td th:text="${info.type}"></td>
	</tr>
</table>

4.8.2 th:each 状态变量

<table>
	<tr th:each="info ,var : ${list}">
		<td th:text="${info.id}"></td>
		<td th:text="${info.name}"></td>
		<td th:text="${info.type}"></td>
		<td th:text="${var.index}"></td>
		<td th:text="${var.count}"></td>
		<td th:text="${var.size}"></td>
		<td th:text="${var.even}"></td>
		<td th:text="${var.odd}"></td>
		<td th:text="${var.first}"></td>
		<td th:text="${var.last}"></td>
	</tr>
</table>

index：当前迭代器的索引
count：当前迭代对象的计数，从1开始
size：被迭代对象的长度
even/odd：布尔值，当前循环是奇数还是偶数，从0开始
first：当前循环是否是第一条。如果是返回true，否则返回false
last：当前循环是否是最后一条。如果是返回true，否则返回false

4.8.3 th:each迭代Map

	@RequestMapping("show")
	public String showInfo(Model model){
		Map<String,Info> map= new HashMap<String,Info>();
		map.put("i1",new Info(1,"第一","一"));
		map.put("i2",new Info(2,"第二","二"));
		map.put("i3",new Info(3,"第三","三"));
		model.addAttribute("list", map);
		return "showList";
	}

<table>
	<tr th:each="maps :${map}">
		<td th:each="entry:${maps}" th:text="${entry.value.id}">
		<td th:each="entry:${maps}" th:text="${entry.value.name}">
		<td th:each="entry:${maps}" th:text="${entry.value.id}">
	</tr>
</table>

4.9 域对象操作

4.9.1 HttpServletRequest对象

request.setAttribute("req", "HttpServletRequest");

 <span th:text="${#httpServletRequest.getAttribute('req')}"></span>

4.9.2 HttpSession对象

request.getSession().setAttribute("sess", "HttpSession");

<span th:text="${session.sess}"></span>

4.9.3 Application对象

request.getSession().getServletContext().setAttribute("app", "Application");

<span th:text="${application.app}"></span>

4.10 URL表达式

th:href
th:src

4.10.1 语法

基本语法：@{}

4.10.2 URL类型

4.10.2.1 绝对路径

<a th:href="@{http://www.baidu.com}">绝对路径</a>

4.10.2.2 相对路径

相对于当前项目的根

<a th:href="@{/show}">相对路径</a>

相对于服务器的根

<a th:href="@{~/project2/resourcename}">相对路径</a>

4.10.3 在url中传递参数

<a th:href="@{/show (id=1,name=lisi)}">相对路径</a>

比笨鸟还菜

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录