Skip to content

Instantly share code, notes, and snippets.

@vaibhavpandeyvpz
Created July 25, 2021 11:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vaibhavpandeyvpz/3ef88b76dfb27b86cfec9b932a3ec522 to your computer and use it in GitHub Desktop.
Save vaibhavpandeyvpz/3ef88b76dfb27b86cfec9b932a3ec522 to your computer and use it in GitHub Desktop.
React hook to track window resize events.
import { useEffect, useState } from 'react';
/**
* @return {{width: Number, height: Number}}
*/
function getWindowSize() {
return {
width: window.innerWidth,
height: window.innerHeight,
};
}
/**
* @return {{width: Number, height: Number}}
*/
function useWindowSize() {
const [size, setSize] = useState(getWindowSize());
useEffect(() => {
const listener = () => setSize(getWindowSize());
window.addEventListener('resize', listener);
return () => window.removeEventListener('resize', listener);
}, []);
return size;
}
export default useWindowSize;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment