[구현] Shopping List project, 오류 해결

쇼핑 리스트에서 휴지통 아이콘을 누르면 리스트를 삭제해야되는데 리스트 전체가 삭제되는 오류 발생

2021.05.11

ul.addEventListener('click', (e) => {
  // console.log(e.target === removeBtn[0])
  e.target.parentElement.remove();
});

위와 같이 이벤트가 일어난 타겟의 부모를 지워버리면 계속해서 이벤트가 타고 올라가기 때문에 body 자체가 지워져 버린다.🤣

오류 해결 코드

그래서 이벤트가 일어나야되는 대상을 정확히 체크해줄 필요가 있다!
조건문에서 i태그들에 클래스를 비교해서 조건문 처리를 주어서 오류를 해결할 수 있었다.

ul.addEventListener('click', (e) => {
  // console.log(e.target === removeBtn[0])
  if (e.target.classList[0] === 'fas') {
    e.target.parentElement.remove();
  }
});