Kompromisy, wzorce referencji i wartości domyślne

Cel: Wybrać odpowiedni sposób obsługi danych wejściowych.

• Kontrolowane: wartość znajduje się w stanie; przy każdej zmianie następuje ponowne renderowanie
• Niekontrolowane: DOM przechowuje wartość; w razie potrzeby odczytuje się ją za pomocą ref
• Wartości domyślne: defaultValue, defaultChecked

• Kontrolowane: świetne do bieżącej walidacji, masek i synchronizowania innych pól
• Niekontrolowane: mniej ponownych renderowań; proste formularze odczytywane wyłącznie przy wysyłaniu
• Połączenie obu podejść: kontrolowane dla kluczowych pól, niekontrolowane dla opcjonalnych

Kontrolowane pole przechowuje value w stanie i aktualizuje je przy każdej zmianie.

Niekontrolowane pole korzysta z wartości przechowywanej w DOM; w razie potrzeby odczytuje się ją za pomocą ref.

Dla wartości domyślnych pól niekontrolowanych należy używać defaultValue/defaultChecked; na podejście kontrolowane należy przejść, gdy potrzebne są reguły działające na bieżąco.

• Nie należy łączyć value i defaultValue w tym samym polu
• Do odczytywania wartości niekontrolowanych należy używać refs
• Należy wybrać podejście kontrolowane, gdy interfejs reaguje na każde naciśnięcie klawisza

Podsumowanie: Podejście kontrolowane sprawdza się przy regułach działających na bieżąco i stanie pochodnym, a niekontrolowane — przy prostych formularzach odczytywanych wyłącznie przy wysyłaniu. Do odczytywania wartości należy używać ref, a do ustawiania początkowej zawartości — defaultValue.