react modal close1 React 모달 밖 영역 클릭시 닫기 (2가지 방법) > useState 사용 모달 바깥 부분(OutModal)에 투명한 배경을 뷰포트 크기로 깔고 이곳을 클릭했을때 모달을 닫아준다. 여기서 중요한점은 모달(DetailModal)과 모달 바깥 부분(OutModal)은 "형제"여야 하고, 모달의 z-index가 모달 바깥 부분보다 더 높아야한다. 즉 모달과 모달 바깥 부분은 다른 층에 존재하는 것이다. (이벤트 버블링을 막기 위해서!) // 모달을 사용하는 컴포넌트 function Container() { const [modal, setModal] = useState(false); const openModalPopup = () => { setModal(true); document.body.style.overflow = "hidden"; }; const clo.. 2023. 10. 10. 이전 1 다음
