react: render props content was into refs (#10368)

* react: react props content was into refs

* Refactor refs section to eliminate redundancy

Removed duplicate explanation about React refs and streamlined the content.

---------

Co-authored-by: Javier Canales <56018501+jcanalesluna@users.noreply.github.com>
This commit is contained in:
Reyes Rondón
2026-09-23 14:52:55 +02:00
committed by GitHub
co-authored by Javier Canales
parent 9e79897317
commit 1ac991f75c
@@ -1,10 +1,10 @@
# Refs
A render prop is a pattern where a component takes a function as a prop and calls it to decide what to render. This allows the component to share logic with whatever gets rendered, without dictating the exact UI. It was common before hooks existed, and hooks now cover many of the same use cases in a simpler way.
Refs provide a way to access DOM nodes or React elements created in the render method. In the typical React dataflow, props are the only way that parent components interact with their children. To modify a child, you re-render it with new props. However, there are a few cases where you need to imperatively modify a child outside of the typical dataflow. The child to be modified could be an instance of a React component, or it could be a DOM element. For both of these cases, React provides an escape hatch.
Visit the following resources to learn more:
- [@official@Referencing Values with Refs](https://react.dev/learn/referencing-values-with-refs)
- [@official@Manipulating the DOM with Refs](https://react.dev/learn/manipulating-the-dom-with-refs)
- [@article@Examples of using refs in React](https://www.robinwieruch.de/react-ref/)
- [@video@Learn useRef in 11 Minutes - Web Dev Simplified](https://www.youtube.com/watch?v=t2ypzz6gJm0)
- [@video@Learn useRef in 11 Minutes - Web Dev Simplified](https://www.youtube.com/watch?v=t2ypzz6gJm0)