Skip to main content
Version: 5.10.0

useMergeRefs

About​

Merges any number of refs into a single ref

Installation​

npm install --save rooks

Importing the hook​

import { useMergeRefs } from "rooks";

Usage​

function Demo() {
const mousedownRef = useEventListenerRef("mousedown", () => {
console.log("mouse down");
});
const mouseupRef = useEventListenerRef("mouseup", () => {
console.log("mouse up");
});
const ref = useMergeRefs(mousedownRef, mouseupRef);

return (
<div>
<h1>Rooks : useMergeRefs Example</h1>
<hr></hr>
<div ref={ref}>
A div with multiple refs. Click me!!
</div>
</div>
);
}

render(<Demo />);

Arguments​

Argument valueTypeDescription
refsArrayTakes any number of refs. Refs can be mutable refs or function refs.

Returns​

Return valueTypeDescription
refCallbackRefMerged ref

Codesandbox Examples​

Basic Usage​

Join Bhargav's discord server​

You can click on the floating discord icon at the bottom right of the screen and talk to us in our server.