Refs în React

Dacă vrem să memorăm o anumită informație, dar nu vrem ca modificarea ei să declanșeze randarea componentei, atunci ne vor fi utile refs și, în consecință, hook-ul useRef care lucrează cu ele.

Un ref (sau referință) este un obiect JavaScript obișnuit cu o singură proprietate current, pe care o puteți citi sau modifica.

La fel ca stările, refs pot stoca orice tip de date - acestea pot fi numere, șiruri de caractere, obiecte și chiar funcții.

Dacă datele dvs. sunt utilizate pentru randare, atunci stocați-le în stare, iar dacă nu aveți nevoie de randare, în astfel de cazuri utilizarea refs poate deveni mai eficientă. În plus, spre deosebire de stare, valoarea unui ref se modifică imediat.

În general, refs sunt aplicate acolo unde trebuie să depărtați de React și să interacționați cu API-uri externe - mai des cu cele ale browserului, care nu afectează afișarea componentei. Acesta poate fi, de exemplu, stocarea id-ului unui timer sau stocarea unui obiect pentru care nu este nevoie să se calculeze JSX, dar cel mai adesea este vorba despre interacțiunea cu elementele DOM. Ele pot fi folosite pentru managementul focusului, selecția textului sau redarea multimedia.

În lecția următoare vom analiza practic lucrul cu refs și hook-ul useRef.