useResizeObserver
useResizeObserver는 ResizeObserver를 통해 element의 크기를 추적합니다. ref callback과 현재 width, height를 반환합니다.
import { useResizeObserver } from '@ilokesto/utilinent/hooks';
function SizeBox() {
const { ref, width, height } = useResizeObserver();
return <div ref={ref}>{width}×{height}</div>;
}Options
| Option | 설명 |
|---|---|
box | Observer box model입니다. 기본값은 content-box입니다. |
initialSize | 첫 observation 이전의 initial size입니다. |
반환값
ref는 callback ref입니다. width와 height는 number(기본값 0)입니다. entry는 사용 가능한 최신 ResizeObserverEntry입니다. SSR-safe: ResizeObserver가 없으면 0을 반환합니다.