- 새로고침, 페이지 닫기
- beforeunload
- 브라우저가 페이지를 unload 하기 직전에 실행된다.
useEffect(() => {
window.addEventListener("beforeunload", handleBeforeUnload);
//로직 구현
return (() => {
window.removeEventListener("beforeunload", handleBeforeUnload);
});
}, [handleBeforeUnload]);- 뒤로가기
- popstate
- 브라우저의 기록을 탐지하는 이벤트이다. 참고로 앞으로 가기는 ‘pushstate’를 사용한다.
// 뒤로가기 감지
useEffect(() => {
const handlePopState = () => {
//로직 구현
console.log('User navigated backwards, disconnect! ');
};
window.addEventListener('popstate', handlePopState);
// Cleanup the event listener on component unmount
return () => {
window.removeEventListener('popstate', handlePopState);
};
}, []);- 페이지 이동
- router.push
const navigateToDashboard = () => {
router.push({
pathname: '/dashboard',
});
};Share article
