React Hooks

A set of reusable React Hooks.

Hooks are a new feature proposal that lets you use state and other React features without writing a class. They’re currently in React v16.7.0-alpha and being discussed in an open RFC.

Installation

npm i @softbind/react-hooks --save

API

useMeasure(ref, types)

Arguments

• ref: HTMLElement: ref is a HTMLElement returned from useRef hook.
• types: string | Array<string>: types of info that you would like to fetch from dom. Available types: ['client', 'offset', 'scroll', 'bounds', 'margin']

Returns

• measure: Object: Current measure info based on provided types arg.

import { useMeasure } from '@softbind/react-hooks'

const MyComponent = () => {
  const ref = useRef(null)
  const { bounds } = useMeasure(ref, 'bounds')

  console.log(bounds)

  return (
    <div ref={ref}>Test</div>
  )
}