use-measure

It's just a React hook for resize-observer, uses resize-observer-polyfill. Inspired by react-measure

Install

Note: React 16.8+ is required for Hooks.

With npm

npm i use-measure --save

Or with yarn

yarn add use-measure

Usage

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 (
    <div ref={nodeRef}>
      /* ... */
    </div>;
  );
}