React JS - forwardRef

• forwardRef is an advance version of Ref.
• To communicate parent component and child component, we use forwardRef.

Problem Statement :

Child Component contains input box while Parent Component contains button. We want to communicate or connect both input box and button, in this case we will use forwardRef.

In the following example, when user clicks on button, the color of input field text changes.