useWindowSize()
useWindowSize(
debounce
?):object
Defined in: src/hooks/dom/useWindowSize.ts:48
A custom React hook to track the current window size. Automatically updates whenever the window is resized.
Parameters
debounce?
number
= 0
The debounce delay in milliseconds for the resize event. Defaults to 0 (no debounce).
Returns
object
An object containing the current window width and height.
width
width:
number
height
height:
number
Examples
tsx
import { useWindowSize } from '@zl-asica/react';
const MyComponent = () => {
const { width, height } = useWindowSize();
return (
<div>
<p>Width: {width}px</p>
<p>Height: {height}px</p>
</div>
);
};
with debounce:
tsx
import { useWindowSize } from '@zl-asica/react';
const MyComponent = () => {
const { width, height } = useWindowSize(300); // Update size with 300ms debounce
return (
<div>
<p>Width: {width}px</p>
<p>Height: {height}px</p>
</div>
);
};