Refy v React

Ak chceme zapamätať si nejakú informáciu, ale nechceme, aby jej zmena spôsobila renderovanie komponentu, potom sa nám budú hodiť refy a zodpovedajúce hook useRef, ktorý s nimi pracuje.

Ref (alebo odkaz) je obyčajný JavaScriptový objekt s jedinou vlastnosťou current, ktorú môžete čítať alebo meniť.

Rovnako ako stavy, refy môžu ukladať akýkoľvek typ dát - môžu to byť čísla, reťazce, objekty a dokonca funkcie.

Ak sa vaše dáta používajú pre renderovanie, tak ich ukladajte do stavu, a ak nepotrebujete renderovanie, v takom prípade môže byť použitie refov efektívnejšie. Navyše na rozdiel od stavu sa hodnota refu mení okamžite.

Vo všeobecnosti sa refy aplikujú tam, kde musíte ustúpiť od Reactu a interagovať s externými API - najčastejšie s prehliadačovými, ktoré neovplyvňujú zobrazenie komponentu. Môže to byť napríklad ukladanie id časovača alebo ukladanie objektu, pre ktorý nie je potrebné počítať JSX, ale najčastejšie je to interakcia s DOM elementmi. Môžu sa použiť pre riadenie focusu, výber textu alebo prehrávanie médií.

V nasledujúcej lekcii rozoberieme prácu s refmi a hookom useRef v praxi.