Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

use-composed-ref

Package Overview
Dependencies
Maintainers
1
Versions
6
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

use-composed-ref

React hook which creates a ref function from given refs. Useful when using forwardRef.

  • 1.2.0
  • Source
  • npm
  • Socket score

Version published
Maintainers
1
Created

What is use-composed-ref?

The npm package 'use-composed-ref' provides a React hook that allows you to compose multiple refs (both React ref objects and callback refs) into a single callback ref. This is particularly useful in scenarios where you need to attach multiple refs to a single element, such as when using third-party libraries that require a ref, while also maintaining your own ref for the same element.

What are use-composed-ref's main functionalities?

Composing multiple refs

This feature allows the user to combine multiple refs into one, which can then be attached to a React element. In the code sample, `myRef` and `externalRef` are composed into a single ref `composedRef`, which is then used in a div element.

import React, { useRef } from 'react';
import useComposedRef from 'use-composed-ref';

function MyComponent() {
  const myRef = useRef(null);
  const externalRef = useRef(null);
  const composedRef = useComposedRef(myRef, externalRef);

  return <div ref={composedRef}>Hello, world!</div>;
}

Other packages similar to use-composed-ref

FAQs

Package last updated on 23 Dec 2021

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc