카테고리별로 아이템을 볼 수 있는 기능을 구현하였다.
기존의 카테고리 구조는 현재 구현하고자 하는 기능에 비해 너무 방대하고 복잡해서 제거하였고, 카테고리를 Item이 가진 String type 속성으로 설정하였다.
이렇게 기존에 있던 네비게이션 바에 카테고리를 종류별로 미리 넣어두고, 버튼을 통해 해당 카테고리의 이름을 url에 포함시켜서 get 요청을 하도록 하였다.
- view
<a class="nav-link dropdown-toggle" id="navbarDropdown" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">Shop</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="/main">All Products</a></li>
<li><hr class="dropdown-divider" /></li>
<li><a class="dropdown-item" th:href="@{/category/top}">Top</a></li>
<li><a class="dropdown-item" th:href="@{/category/trouser}">Trouser</a></li>
<li><a class="dropdown-item" th:href="@{/category/shoe}">Shoe</a></li>
</ul>- controller
@GetMapping("/category/{categoryName}")
public String main_cateogory(@PathVariable("categoryName") String cateogoryName,Model model){
log.info("-------------------------------category_---------------------------");
List<Item> items = itemService.findByCategory(cateogoryName);
log.info(cateogoryName);
log.info(String.valueOf(items.size()));
model.addAttribute("items",items);
return "main";
}categoryName을 pathVariable로 받아서 해당 카테고리 이름을 가진 아이템들을 repository에서 찾는다.
이렇게 찾아진 아이템 List를 model에 담아서 다시 main 화면을 호출하면 main화면은 model에 담긴 아이템들만 출력하기 때문에 카테고리에 해당하는 아이템들만 화면에 나타난다.
- repository
public List<Item> findByCategory(String categoryName){
return em.createQuery("select i from Item i where i.category =: categoryName")
.setParameter("categoryName",categoryName)
.getResultList();
}jpa의 createQuery 기능을 사용하여 List를 반환받았다. 기존의 Category 객체를 이용해서 코드를 작성했을 때 이부분에서 계속 오류가 발생해서 Cateory객체를 코드에서 제외했었다.
- 화면
top 카테고리를 선택했을 때 나오는 화면
