overlay.unmountAll
overlay.unmountAll
은 열려 있는 모든 오버레이를 React 요소 트리와 메모리에서 완전히 제거하는 함수예요.
overlay.unmountAll();
레퍼런스
overlay.unmountAll()
특정 오버레이의 메모리를 해제할 때 overlay.unmountAll
를 호출하세요.
overlay.unmountAll();
주의사항
- 이 함수를 호출하면 즉시 메모리를 해제하기 때문에 오버레이 닫기 애니메이션이 보이지 않을 수 있어요.
- 애니메이션이 있는 오버레이의 경우,
overlay.closeAll
을 호출하고 닫기 애니메이션이 끝난 후overlay.unmountAll
을 호출해야 자연스러운 사용자 경험을 제공할 수 있어요.
인터페이스
function unmountAll(): void;
사용법
자동으로 생성된 ID를 사용하는 경우
아래는 여러 개의 오버레이를 열고, overlay.unmountAll
을 사용해 모두 제거하는 간단한 예제예요.
overlay.open(({ isOpen, close, unmount }) => {
return <ConfirmDialog isOpen={isOpen} close={close} onExit={unmount} />;
});
overlay.open(({ isOpen, close, unmount }) => {
return <ConfirmDialog isOpen={isOpen} close={close} onExit={unmount} />;
});
overlay.open(({ isOpen, close, unmount }) => {
return <ConfirmDialog isOpen={isOpen} close={close} onExit={unmount} />;
});
// 위 세 개의 오버레이를 모두 닫습니다.
overlay.unmountAll();
애니메이션이 있는 경우
애니메이션이 적용된 경우에는 닫기 애니메이션이 끝난 후 overlay.unmountAll
을 호출해야 자연스러운 사용자 경험을 제공할 수 있어요.
const overlayId = overlay.open(({ isOpen, close, unmount }) => {
return <ConfirmDialog isOpen={isOpen} close={close} onExit={unmount} />;
});
overlay.closeAll();
setTimeout(() => {
overlay.unmountAll();
}, 1000);