How to use React.forwardRef in a class based component?

Question

I\'m trying to use React.forwardRef, but tripping over how to get it to work in a class based component (not HOC).

The docs examples use elements and functional comp

Answer 1

Incase you need to reuse this in many difference components, you can export this ability to something like withForwardingRef

const withForwardingRef = (BaseComponent: React.ReactType) =>
    React.forwardRef((props, ref) => );

export default withForwardingRef;

usage:

const Comp = ({forwardedRef}) => (
 
)
const EnhanceComponent = withForwardingRef(Comp);  // Now Comp has a prop called forwardedRef