mirror of
https://github.com/nilbuild/developer-roadmap.git
synced 2026-09-29 16:57:32 +08:00
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:
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)
|
||||
|
||||
Reference in New Issue
Block a user