Refs in ReactJS || ReactJS Tutorials

Veröffentlicht am: 14 Juli 2018
auf dem Kanal: Tech Talk
160
3

Refs provide a way to access DOM nodes or React elements created in the render method.
Generally, the use of refs should be considered only when the required interaction cannot be achieved using the mechanisms of state and props.
You may not use the ref attribute on functional components because they don’t have instances. You should convert the component to a class if you need a ref to it, just like you do when you need lifecycle methods or state.

React provides three major ways of creating refs
1. String refs (deprecated)
2. Callback refs
3. createRef

createRef() API introduced in React 16.3. If you are using an earlier release of React, we recommend to use callback refs instead.

If the ref callback is defined as an inline function, it will get called twice during updates, first with null and then again with the DOM element. This is because a new instance of the function is created with each render, so React needs to clear the old ref and set up the new one. You can avoid this by defining the ref callback as a bound method on the class, but note that it shouldn’t matter in most cases.

When to use refs
-------------------------------
There are a few good use cases for refs:
1. Managing focus, text selection, or media playback.
2. Triggering imperative animations.
3. Integrating with third-party DOM libraries.

Avoid using refs for anything that can be done declaratively.


Auf dieser Seite können Sie das Online-Video Refs in ReactJS || ReactJS Tutorials mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Tech Talk 14 Juli 2018 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 160 Mal angesehen und es wurde von 3 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!