react-generic-functions
v1.0.9
Published
React generic memo & forwardRef
Downloads
69
Maintainers
Readme
react-generic-functions
Simple generic memo & forwardRef react functions
Usage
import { memo, forwardRef } from 'react-generic-funtions';
interface ExampleComponentProps<T> {
genericProp: T
}
const ExampleComponent = forwardRef(
<T extends string | number>({ genericProp }: ExampleComponentProps<T>,
ref: ForwardedRef<HtmlDivElement>
) => {
const message = useMemo(() => {
if (typeof genericProp === 'number') {
return 'hello';
} else {
return 'word';
}
}, [genericProp])
return (
<div ref={ref}>
{message}
</div>
);
}
);
import { useRef } from 'react';
const ExampleRoot: FC = () => {
const componentRef = useRef<HtmlDivElement>(null);
const [state, setState] = useState<string | number>(0)
// ...
return (
<div>
{/* ... */}
<ExampleComponent genericComponent={state} ref={ref} />
{/* ... */}
</div>
)
}