Bevaring af værdier uden ny rendering

Formål: Gem værdier, der overlever re-renderinger, uden at udløse en ny rendering. useRef giver dig en stabil .current-beholder.

• Bevares på tværs af renderinger
• Udløser ikke en ny rendering ved ændringer
• Velegnet til timere og tidligere værdier

Opdateringer med useState renderer brugergrænsefladen igen. Opdateringer med useRef gør ikke. Vælg en ref til foranderlige hjælpeværdier (identifikatorer og tællere til logik), ikke til data, der skal vises i brugergrænsefladen.

Vi øger en renderCount i en effekt og gemmer den i en ref. Den overlever renderinger, men udløser dem ikke.

Gode anvendelser:

• Id'er til timere og intervaller
• Cachelagrede tidligere værdier
• Flag mellem renderinger (for eksempel isMounted)

Ikke til: data, der skal vises i brugergrænsefladen.

Gem interval-id'et i en ref, så vi kan starte og stoppe timeren uden ekstra renderinger.

Faldgruber:

• Læs ikke en ref for at styre brugergrænsefladen uden tilstand – brugergrænsefladen opdateres ikke.
• Nulstil refs ved afmontering, hvis de indeholder id'er eller ressourcer.
• Undgå at overbruge refs som globale samlinger.

Opsummering: Brug useRef til foranderlige værdier, der lever på tværs af renderinger – for eksempel id'er, tidligere værdier eller flag – uden at udløse nye renderinger. Brug tilstand til synlig brugergrænseflade.