mousedown과 touchstart에 대한 질문입니다

따라하며 배우는 리액트 A-Z[19버전 반영]

모달 창 외부 클릭 시 모달 닫게 만드는 Custom Hooks 생성

작성

684

안녕하세요 좋은 강의 잘 듣고있습니다. 감사합니다.

useOnClickOutside 함수에서

document.addEventListener("mousedown", listener);

document.addEventListener("touchstart", listener);

를 이용해서 모달 창 외부를 클릭했는지 감지하는 것으로 이해했습니다.

그래서 저는 mousedown과 touchstart 대신에

document.addEventListener("click", listener) 을 써도 되지 않을까 싶어서 해봤는데 이렇게 하니까 모달창이 아예 나타나지 않더라구요.

'touchstart' 이벤트 리스너는 없어도 동일하게 동작하는 것 같은데

'click' 'mousedown' 이벤트는 어떤 차이가 있는 것인지 궁금합니다. 감사합니다.

답변 2

제가 해봤는데 저도 안되네요 click으로 하면 안되네요

바로 하위에 있는 .modal-close라는 span태그에 이미 onClick 이벤트에 대한 바인딩이 되어있어서인지 이유는 모르겠지만 안됩니당 ㅋㅋ

지식공유자

안녕하세요 !!

mousedown

사용자가 해당 element에서 마우스 버튼을 눌렀을 때 발생합니다.

click

사용자가 해당 element를 클릭했을 때(버튼을 눌렀다가 떼었을 때) 발생합니다.

감사합니다!!

인프런 커뮤니티 질문&답변