A React Hook to monitor elements size changes – resize-observer-hook

Category: React React Others | September 3, 2021
Author: Gautam-Arora24
Official Page: Go to website
Last Update: September 3, 2021
License: MIT

react resize observer hook

Description:

This hook can be useful for you if you are looking for a way to monitor elements size changes in React.

How to install and use it?

1. Install the resize-observer-hook component with npm.

npm install --save resize-observer-hook

2. Import the required components.

import React from 'react'
import useResizeObserver from 'resize-observer-hook'

3. The code usage.

const App = () => {
  const [ref, width, height] = useResizeObserver()

  return (
    <div ref={ref}>
      {width} X {height}
    </div>
  )
}