Package for working with browser tab activity.
npm install @ludaalt/react-document-visibilityuseDocumentVisibility.ts
jsx
import React from 'react';
import { useDocumentVisibility } from '@ludaalt/react-document-visibility';
const LeaveTabCounter = () => {
const { count, visible, onVisibilityChange } = useDocumentVisibility();
useEffect(() => {
onVisibilityChange((isVisible) => {
console.log('first handler', isVisible);
});
onVisibilityChange((isVisible) => {
console.log('second handler', isVisible);
});
}, []);
return (
Вы покинули страницу: {count} раз Вкладка активна? {visible ? 'да' : 'нет'}
);
};
``