리액트 뒤로가기 이벤트

jeongwon yun·2022년 10월 16일
0

etc

목록 보기
3/5

부모 컴포넌트

const Parent = () => {
    const [closeSession, setCloseSession] = useState(false);
    const closeQuickView = () => {
        setCloseSession(true);
    };
    useEffect(() => {
        window.history.pushState('fake-route', document.title, window.location.href);
        window.addEventListener('popstate', closeQuickView);
        return () => {
            window.removeEventListener('popstate', closeQuickView);
            if (window.history.state === 'fake-route') {
                window.history.back();
            }
        };
    }, []);
    return (
        <Child closeSession={closeSession} />
    );
};

자식 컴포넌트

const Child = ({ closeSession }) => {
    useEffect(() => {
    if (closeSession) {
      doAnything();
    }
  }, [closeSession]);
};

0개의 댓글