버튼 누르면 정보 가져와서 장바구니에 담기.

상품의 id값 쉽게 가져오기

data-이름 속성 을 사용해 각 상품의 구매 버튼에 data-id 값을 넣어준다. 

그리고 click이벤트가 일어나면, e.target.dataset.id 이런식으로 내가 누른 그것에 대한 data-id 정보를 가져온다. 

이떄 click 이벤트 리스너 에는 파라미터 e 넣어주는거 잊지 말것.

 

카트에 지금 누른 그 상품 있는지 없는지 확인

아무것도 누르지 않았다면

cart는 지금 빈 상태인데,

cart.findIndex()로 조건에 부합하는 최초의 인덱스 값을 찾아낸다. 

그리고 만약 그 값이 없다면 -1을 리턴하니깐, 

-1이 나온다면 지금 누른 그 상품이 카트에 아직 없다는 말임.

그러니까 cart에 넣어주어야 한다.

 

없다면 카트에 넣자

이때는 전체상품.find()를 이용해서 조건에 해당하는 최초의 요소 자체를 가져와서, 그것을 cart에 push!!

그리고 있다면 카트의 val 조정해야 하니까 속성 하나 더 추가

추가하려는 객체이름.추가하고자하는 속성 = 설정값 

나는 숫자 셀꺼니까 아래처럼 함. 

find한 객체.count = 1; 

이렇게 하면 간편하게 속성을 추가할 수 있음.

 

 

 

있다면 카트의 val을 조정하자. 

cart.findIndex()가 -1이 아니라면 이미 cart에 내가 누른 상품이 있다는 말. 

그러니까 cart[findIndex() 한 값]. 추가한 속성 ++ 

저렇게 해주면 됨. 

 

cart에 담긴 데이터들을 이용해서 장바구니에 상품정보 보여주자

저건 그냥 forEach같은 반복문 돌리고 append해주면 됨. 

 

장바구니에 담았으면 최종가격 계산도 바뀌어야 하는데??

이건 이따가 함수선언문 작성해서 최종가격 계산하게 만들어 줄꺼니까 일단 그 함수 이름만 적어주기

함수이름() 이렇게

 

input값 조절해도 최종가격 변경되야하는데?

이거는 .on('input', function(){}) 이벤트 리스너 안에 함수이름() 적어주면 됨.