@heyanniemoran/use-document-visibility

use-document-visibility

Install

npm i @heyanniemoran/use-document-visibility

Usage

import React, { useEffect } from 'react'
import useDocumentVisibility from '@heyanniemoran/use-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 (
    <div>
      <span>
        Вы покинули страницу: {count} раз
        Вкладка активна? {visible ? 'да' : 'нет'}
      </span>
    </div>
  );
};

License

MIT © heyanniemoran

---

This hook is created using create-react-hook.