useWindowDimensions.ts 587 B

1234567891011121314151617181920212223242526
  1. import { useState, useEffect } from 'react';
  2. function getWindowDimensions () {
  3. const { innerWidth: width, innerHeight: height } = window;
  4. return {
  5. width,
  6. height
  7. };
  8. }
  9. export default function useWindowDimensions () {
  10. const [windowDimensions, setWindowDimensions] = useState(getWindowDimensions());
  11. useEffect(() => {
  12. function handleResize () {
  13. setWindowDimensions(getWindowDimensions());
  14. }
  15. window.addEventListener('resize', handleResize);
  16. return () => window.removeEventListener('resize', handleResize);
  17. }, []);
  18. return windowDimensions;
  19. }