use-dynamic-refs
v1.0.0
Published
A React hook to dynamically set and get DOM/Component refs
Downloads
15,556
Readme
React use-dynamic-refs
Made with create-react-library
Install
npm install --save use-dynamic-refs
Usage
import React, { useEffect } from 'react';
import useDynamicRefs from 'use-dynamic-refs';
const Example = () => {
const foo = ['random_id_1', 'random_id_2'];
const [getRef, setRef] = useDynamicRefs();
useEffect(() => {
// Get ref for specific ID
const id1 = getRef('random_id_1');
console.log(id1)
}, [])
return (
<>
{/* Simple set ref. */}
<span ref={setRef('random_id_3')}></span>
{/* Set refs dynamically in Array.map() */}
{ foo.map((eachId, idx) => (
<div ref={setRef(eachId)}> Hello {each} </div>))}
</>
)
}
export default Example;
License
MIT © fitzmode