1차 프로젝트 코드리뷰(장바구니)

1차 프로젝트에 구현했던 기능 중 장바구니 수량 증가, 감소 및 수량이 0이 될시 자동 삭제가 되게 하였던 코드가 기억에 남아 작성하게 되었다.

const handleRemove = id => {
    const newList = cartList.filter(el => el.id !== id);
    setCartList(newList);
  };

  const quantityIncrease = id => {
    setCartList(el => {
      const result = el.map(listItem => {
        if (listItem.id === id) listItem.quantity += 1;
        return listItem;
      });
      return result;
    });
  };

  const quantityDecrease = id => {
    setCartList(el => {
      const result = el.map(listItem => {
        if (listItem.id === id) listItem.quantity -= 1;
        if (listItem.quantity === 0) handleRemove(listItem.id);
        return listItem;
      });
      return result;
    });
  };

handleRemove는 id 값을 받아 해당 id에 해당하는 요소를 filter로 삭제하는 방법으로 코딩하였다.

아이템이 들어있는 cartlist state의 엘리먼트 요소로 map을 사용. id 값을 비교 후

맞는 조건에 수량 증감 +-1 씩 해주는 방법으로 구현하였고 수량이 0이 될시

handleRemove 함수가 실행이 되어 삭제가 되게 하였다.

이번 프로젝트 중 제일 고민 많았던 기능으로 코딩을 하면서도 확실하지 않았던 부분들이

있어 이와같이 작성하게 되었다.