Skip to content

Instantly share code, notes, and snippets.

@gaearon
Created November 1, 2018 10:05
Show Gist options
  • Star 94 You must be signed in to star a gist
  • Fork 13 You must be signed in to fork a gist
  • Save gaearon/cb5add26336003ed8c0004c4ba820eae to your computer and use it in GitHub Desktop.
Save gaearon/cb5add26336003ed8c0004c4ba820eae to your computer and use it in GitHub Desktop.
Examples from "Making Sense of React Hooks"
function MyResponsiveComponent() {
const width = useWindowWidth(); // Our custom Hook
return (
<p>Window width is {width}</p>
);
}
function useWindowWidth() {
const [width, setWidth] = useState(window.innerWidth);
useEffect(() => {
const handleResize = () => setWidth(window.innerWidth);
window.addEventListener('resize', handleResize);
return () => {
window.removeEventListener('resize', handleResize);
};
});
return width;
}
@cs-joy
Copy link

cs-joy commented Sep 26, 2021

i am one of the newbie in react learning.
thank you for explanation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment