Redux Toolkit을 이용하여 장바구니 기능을 구현
- 장바구니에 담기
- 수량 변경 및 삭제 기능
🔎 코드요약
ProductInfo.js
장바구니 담기 클릭 > dispatch로 정보 전달
- addItem : cartItem의 reducer
기존 어레이에 dispatch로 받아온 정보를 push해줌
상품의 id값을 비교하여 이미 있는 상품의 경우 해당상품의 count를 +1 해줌
cartItemSlice.js
redux store의 slice로, cartItemSlice.js파일로 분리하여 store.js에 import해주었다.
- cartItem : 어레이 자료형, dispatch로 받아온 상품 정보를 저장하는 변수
Cart.js
장바구니 페이지
cartItem에 담긴 값을 map 함수를 사용하여 리스트화
- minus / plus / deleteItem (cartItem의 reducer)
action.payload로 상품의 id값을 받아옴
