Package Exports

react-merge-refs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-merge-refs) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-merge-refs

React utility to merge refs 🖇

npm install react-merge-refs

Example

import React from 'react'
import mergeRefs from 'react-merge-refs'

const Example = React.forwardRef(function Example(props, ref) {
  const localRef = React.useRef()
  return <div ref={mergeRefs([localRef, ref])} />
})

Why?

When developing low level UI components, it is common to have to use a local ref but also support an external one using React.forwardRef. Natively, React does not offer a way to set two refs inside the ref property. This is the goal of this small utility.

Today a ref can be a function or an object, tomorrow it could be another thing, who knows. This utility handles compatibility for you.

License

MIT