React refs are used to retrieve component instances or DOM element instances. In react, refs are used to retrieve child component instances or DOM element instances within child components.
There are two ways to create a subcomponent: the first is a class component that returns an instance of the component, and the second is a function component that returns a DOM element. When a subcomponent is a class component, to obtain an instance of the subcomponent, just create a ref and assign it to the subcomponent, as follows:
CreateRef () when the parent is a class component, useRef() when the parent is a function component.
Debug to myref value:
To get an instance of an element inside a react. forwardRef component, pass the ref down to the dom. When the forwardRef is wrapped with a redux component, configure the forwardRef configuration:
This gets the instance of the div on the current child component.
Use the react. forwardRef method with useImperativeHandle to expose the instance method to the parent component. UseImperativeHandle can also return concrete DOM element instances internally:
React.forwardRef can also forward instances of ref’s wrapped actual components inside HOC.