后端：
1.Controller層
/** * 這里通過ModelMap把查詢出來的List<model>傳到前端 * 就是若依點擊新增的跳轉頁面的同時，把數據帶入進去 */ @GetMapping("/add") public String add(ModelMap mmap) { mmap.put("book",borrowerInfoService.selectBooksName()); //這里key是需要待會和前端對應的，稍后會備注，value就是我查詢到的一個結果 return prefix + "/add"; }
2.Service
/** *Service接口 */ public List<Books> selectBooksName();
3.ServiceImpl
/** * 查詢方法，這里可以到時候做數據驗證，避免重復數據 * */ @Override public List<Books> selectBooksName() { return booksMapper.selectBooksName(); }
4.Mapper
/** * Mapper接口 */ public List<Books> selectBooksName();
5.Mapper.xml
<select id="selectBooksName" resultMap="BooksResult"> select bookUuid, book_name, author, number , out_number from books </select>
<!--這里返回值一定要返回成功，最好是用實體類返回接收，也可以用Map-->
后端：主要是遇到的問題就是返回值的時候缺失數據，這個稍微細心一點自己就可以排查，debug打起來
前端：
因為選擇用的select2頁面需要引入js和css，主要是select2-css，select2-js，當然若依的include里面已經有了這個
<head> <th:block th:include="include :: header('新增【借閱人信息登記】')"/> <th:block th:include="include :: datetimepicker-css"/> <th:block th:include="include :: select2-css" /> </head> <th:block th:include="include :: footer"/> <th:block th:include="include :: datetimepicker-js"/> <th:block th:include="include :: select2-js" />
頁面：
th:each="post:${book}" book就是對應剛剛Controller層的名字，前端通過book這個名字獲取到后端的參數，用post來接收
th:value="${post.bookName}"這里的post.出來的就是你后台傳出來的值，如果是用對象傳出來的，那就是你對象的字段名，因為是th：value意思就是這個的值，所以你前面post就點你需要的字段
th:text="${post.bookName}"同理，但是這里是th：text，就是你頁面所展示的數據，和上面可以不是同一個字段，我可以展示姓名，傳值ID
<div class="form-group"> <label class="col-sm-3 control-label">書名：</label> <div class="col-sm-8"> <select id="bookName" name="bookName" class="form-control select2-multiple"> <option value=""></option> <option th:each="post:${book}" th:value="${post.bookName}" th:text="${post.bookName}" ></option> </select> </div> </div>
這個我不是很清楚，看見他們都這么寫，我就這么寫，我大概理解就是下拉框中的一個提示
$(function () {
$('#bookName').select2({
placeholder: "請選擇書籍",
allowClear: true
});
})
最終展示結果：
