SpringBoot學習筆記(5)——SpringBoot整合jsp技術

SpringBoot學習筆記(5)——SpringBoot整合jsp技術

1. 創建項目

在這裏插入圖片描述

2. 修改pom文件,添加座標

  <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>

3. 創建springBoot的全局配置文件:application.properties

在這裏插入圖片描述
application.properties:

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

4. 創建Controller

@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

在這裏插入圖片描述
userList.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. 創建啓動類

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

7.運行

運行App.java啓動SpringBoot,在瀏覽器端訪問localhost:8080/showUser
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章