https://github.com/cvpcasada/use-measure
It's just a React hook for resize-observer, uses resize-observer-polyfill.
https://github.com/cvpcasada/use-measure
hook react react-hooks resize-observer
Last synced: 9 months ago
JSON representation
It's just a React hook for resize-observer, uses resize-observer-polyfill.
- Host: GitHub
- URL: https://github.com/cvpcasada/use-measure
- Owner: cvpcasada
- Created: 2019-02-08T13:55:44.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T21:51:51.000Z (over 3 years ago)
- Last Synced: 2025-09-03T11:28:56.013Z (9 months ago)
- Topics: hook, react, react-hooks, resize-observer
- Language: TypeScript
- Size: 550 KB
- Stars: 25
- Watchers: 1
- Forks: 6
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# use-measure
It's just a React hook for resize-observer, uses resize-observer-polyfill. Inspired by [react-measure](https://github.com/souporserious/react-measure)
## Install
> Note: React 16.8+ is required for Hooks.
### With npm
```sh
npm i use-measure --save
```
### Or with yarn
```sh
yarn add use-measure
```
## Usage
```jsx
import { useRef } from "react";
import useMeasure from "use-measure";
function MeasuredDiv() {
const nodeRef = useRef();
const measurement = useMeasure(nodeRef);
// do whatever you want with measurement obj.
// note that measurement will only be available after first render.
return (
/* ... */
;
);
}
```