useDocumentVisibility
A Hook can tell if the page is visible.
The API is different from ahooks.
Examples
Basic usage
API
const { isVisible, visibilityState } = useDocumentVisibility({
onHidden,
onVisible,
onChange,
}: UseDocumentVisibilityOptions);
export interface UseDocumentVisibilityOptions {
onHidden?: () => void;
onVisible?: () => void;
onChange?: (visibilityState: VisibilityState) => void;
}
Params
| Property | Description | Type | Default |
|---|---|---|---|
| onHidden | Document hidden callback | Function | () => void |
| onVisible | Document visible callback | Function | () => void |
| onChange | Document visibility change callback | Function | (visibilityState: VisibilityState) => void |
Result
| Property | Description | Type | Default |
|---|---|---|---|
| visibilityState | Document's visible state | string | hidden | visible |
| isVisible | Determine if the document is visible | boolean | document.visibilityState |