Korzystanie z React Refs i hooka useRef

React stosuje podejście deklaratywne. Aktualizujesz stan, a React aktualizuje interfejs użytkownika (UI). Działa to w większości przypadków.

Jednak czasami musisz wyjść poza Virtual DOM. Możesz potrzebować bezpośredniego dostępu do rzeczywistego elementu HTML. Właśnie tutaj do gry wchodzą Refs i hook useRef.

Czym jest Ref?

Ref to wskaźnik. Łączy on Reacta bezpośrednio z natywnym węzłem DOM.

Dlaczego warto używać useRef zamiast useState?

Aktualizacje stanu wyzwalają ponowne renderowanie (re-render). Oznacza to, że React ponownie rysuje komponent na ekranie. Aktualizacje Ref nie wyzwalają ponownego renderowania. Dzięki temu idealnie nadają się do wartości, które ulegają zmianie