useDocumentVisibility
useDocumentVisibility (문서 가시성 감지)
useDocumentVisibility 훅은 현재 document.visibilityState를 반환해서 현재 탭이 활성 상태인지 감지해요.
출처: 문서
본문
useDocumentVisibility 훅은 현재 document.visibilityState를 반환해요. 이를 통해 현재 탭이 활성 상태인지 감지할 수 있어요.
import { Text } from '@mantine/core';
import { useDocumentTitle, useDocumentVisibility } from '@mantine/hooks';
function Demo() {
const documentState = useDocumentVisibility();
useDocumentTitle(`Document is ${documentState}`);
return <Text>Switch to another tab to see document title change</Text>;
}
정의 (Definition)
// DocumentVisibilityState is 'visible' | 'hidden'
function useDocumentVisibility(): DocumentVisibilityState;
더 알아보기 (Learn more)
- useDocumentTitle — 문서 제목 설정
- useEyeDropper — 화면 색상 선택