useResizeObserver
Registers a ResizeObserver on ref and executes callback when the
observed element is resized.
- @param
ref- ARefObjectof the element to observe. - @param
callback- A function to execute when the observed element is resized. - @param
options- Configurable options - @returns void
Example
const ref = useRef<HTMLElement>(null);
const [size, setSize] = useState({ width: 0, height: 0 });
useResizeObserver(ref, (entry) => setSize({
width: entry.contentRect.width,
height: entry.contentRect.height,
}));