UseWindowSizeExample
src/prod/window/useWindowSize.ts
import React from 'react';
export interface Size {
width: number,
height: number
}
export const useWindowSize = () => {
const [windowSize, setWindowSize] = React.useState<Size>({
width: 0,
height: 0,
});
React.useEffect(() => {
function updateSize () {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
}
window.addEventListener("resize", updateSize);
updateSize();
return () => window.removeEventListener("resize", updateSize);
}, []);
return [windowSize];
};
dist/prod/window/useWindowSize.js
import React from 'react';
export const useWindowSize = () => {
const [windowSize, setWindowSize] = React.useState({
width: 0,
height: 0,
});
React.useEffect(() => {
function updateSize() {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
}
window.addEventListener("resize", updateSize);
updateSize();
return () => window.removeEventListener("resize", updateSize);
}, []);
return [windowSize];
};
src/prod/window/useWindowSize.ts
import React from 'react';
export interface Size {
width: number,
height: number
}
export const useWindowSize = () => {
const [windowSize, setWindowSize] = React.useState<Size>({
width: 0,
height: 0,
});
React.useEffect(() => {
function updateSize () {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
}
window.addEventListener("resize", updateSize);
updateSize();
return () => window.removeEventListener("resize", updateSize);
}, []);
return [windowSize];
};