這個項目是一個springboot的簡單實用demo，主要包括了springboot中靜態資源的配置和控制器的實現。
項目結構
使用的工具是idea，並且用maven構建項目
靜態資源配置
在springboot中靜態資源一般都放在resources中。resources中有幾個文件夾，我來給大家講解一下他們的區別。
首先public文件夾是用來存放你的css和js文件的，就是html或者jsp中會引用的css與js資源，如果不放在這個文件夾的話會出現404的錯誤。在public文件夾中存放的文件是可以直接在url中訪問到的。
然後是static文件夾，這個文件夾放主頁index.html，如果主頁不放在這個文件夾裏面的話會找不到主頁。
最後就是templates文件夾，這個文件夾翻譯過來就是模板，實際上存放的就是控制器跳轉過來的頁面，如果不放在這裏控制器跳轉的時候會找不到頁面的。這也是我在兩個文件夾中都有index.html文件的原因。一個用來當主頁，一個用來給控制器跳轉使用。
前端頁面
我定義了兩個前端頁面，一個用來添加數據，一個用來顯示所有數據，css使用了bootstrap，你可以在bootstrap官網中下載，或者直接用在線的資源 bootstrap下載，不用也沒事，用了會讓你的頁面好看一點。下面我來介紹前端頁面代碼，其中模板引擎使用的是theamleaf
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>書本管理系統</title>
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="modules/css/bootstrap.css">
<!-- jQuery文件。務必在bootstrap.min.js 之前引入 -->
<script src="modules/jquery-3.2.1.js"></script>
<!-- bootstrap.bundle.min.js 用於彈窗、提示、下拉菜單，包含了 popper.min.js -->
<script src="modules/js/bootstrap.bundle.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="modules/js/bootstrap.js"></script>
</head>
<body>
<div class="container">
<h1>springboot demo</h1>
<h4><a href="selectAll">查詢所有圖書</a></h4>
<div class="row">
<div class="col-md-8" >
<form class="form-horizontal" action="/add" method="post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">書名</label>
<div class="col-sm-10">
<input name="name" class="form-control" id="inputEmail3" placeholder="請輸入書名">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">價格</label>
<div class="col-sm-10">
<input name="prize" class="form-control" id="inputPassword3" placeholder="請輸入價格">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">添加</button>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
show.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>書本管理系統</title>
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="modules/css/bootstrap.css">
<!-- jQuery文件。務必在bootstrap.min.js 之前引入 -->
<script src="modules/jquery-3.2.1.js"></script>
<!-- bootstrap.bundle.min.js 用於彈窗、提示、下拉菜單，包含了 popper.min.js -->
<script src="modules/js/bootstrap.bundle.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="modules/js/bootstrap.js"></script>
</head>
<body>
<div class="container">
<h1>springboot demo</h1>
<h4><a href="selectAll">查詢所有圖書</a></h4>
<div class="row">
<div class="col-md-8" >
<form class="form-horizontal" action="/add" method="post">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">書名</label>
<div class="col-sm-10">
<input name="name" class="form-control" id="inputEmail3" placeholder="請輸入書名">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">價格</label>
<div class="col-sm-10">
<input name="prize" class="form-control" id="inputPassword3" placeholder="請輸入價格">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">添加</button>
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
實體類
實體類放在 com.learn.pojo 包下自己定義就好了，一般要和數據庫做映射，在這個demo中我沒有使用數據庫。
我定義的實體類如下，其實就是一個普通的bean
public class Book {
private Integer Id_b;
private String BookName;
private Integer Prize;
public Book(Integer id_b, String bookName, Integer prize) {
Id_b = id_b;
BookName = bookName;
Prize = prize;
}
public Integer getId_b() {
return Id_b;
}
public String getBookName() {
return BookName;
}
public Integer getPrize() {
return Prize;
}
public void setId_b(Integer id_b) {
Id_b = id_b;
}
public void setBookName(String bookName) {
BookName = bookName;
}
public void setPrize(Integer prize) {
Prize = prize;
}
@Override
public String toString() {
return "Book{" +
"Id_b=" + Id_b +
", BookName='" + BookName + '\'' +
", Prize=" + Prize +
'}';
}
}
控制器
控制器的寫法是我們這個demo的重點。我們一共寫三個控制器映射，分別對應 添加圖書， 顯示所有圖書 和 刪除圖書 三個功能
下面我們來看代碼
@Controller
public class BookController {
//用於記錄圖書編號
public static int count = 1;
//用於記錄圖書信息
public static List<Book> list = new ArrayList<>();
//添加圖書信息
@RequestMapping(value="/add", method= RequestMethod.POST)
public String addBook(@RequestParam("name") String BookName,
@RequestParam("prize") Integer Prize){
Book book = new Book(count++, BookName, Prize);
list.add(book);
return "index"; //返回到圖書添加頁面
}
//查詢所有圖書
@RequestMapping("/selectAll")
public String selectAll(Model model){
model.addAttribute("books", this.list);
return "show";
}
//刪除圖書信息
@RequestMapping(value = "delete/{id}", method = RequestMethod.GET)
public String deleteById(@PathVariable("id") int id, Model model){
for (Book li : list){
if(li.getId_b()==id){
list.remove(li);
break;
}
}
return "redirect:/selectAll";
}
}
由於沒有使用數據庫，所以我們使用類的成員變量來存儲數據。
添加圖書使用的是POST方法接收數據，刪除圖書使用的是GET方法接收數據。
我認爲這三個控制器映射可以當做模板使用，以後在項目中就這麼寫控制器就完事了。
成果展示
首先是我們添加圖書的頁面
然後是現實所有圖書的頁面
當我們點擊刪除按鈕的時候會將相應數據刪除並且重新返回這個頁面
至此，這個demo就結束啦，希望對你有所幫助