useSize

A hook that observes size change of an element.

Examples ​

Default usage ​

Try to resize the preview window

width: 786px, height: 72px

Basic usage

useSize can receive element

Pass in the DOM element ​

Try to resize the preview window

width: 1440px, height: 1388px

pass in the DOM element

useSize can receive a dom element as parameter. In SSR scenarios, you can pass in function `() => dom`

API ​

const size = useSize(target);
const size = useSize(target);

Params ​

PropertyDescriptionTypeDefault
targetDOM elementElement | (() => Element)-

Result ​

PropertyDescriptionTypeDefault
sizeSize of the elementAccessor<{ width: number, height: number } | undefined>{ width: target.clientWidth, height: target.clientHeight } | undefined