Gdy dwa komponenty muszą udostępniać ten sam state, przenosisz ("łączysz") ten state w górę do ich najbliższego wspólnego rodzica i przekazujesz go w dół za pośrednictwem props, tak aby istniało jedno źródło prawdy.
() {
[query, setQuery] = ();
(
);
}
Jeśli każde dziecko zachowywałoby swoją własną query, wychodziłyby z synchronizacji. Podniesienie tego oznacza, że input i wyniki zawsze się zgadzają.
Podniesienie state wysoko może zmusić cię do przekazywania props przez wiele pośrednich komponentów, które ich nie używają:
<App user={user}>
<Layout user={user}> {/* just forwarding */}
<Sidebar user={user}> {/* just forwarding */}
<Avatar user={user} /> {/* finally used here */}
children, aby dane pozostały tam, gdzie są używane, zamiast być przesyłane pośrednikami.Zasada przewodnia: podniesienie state tylko tak wysoko, jak musi – nie wyżej. Nadmierne podnoszenie powoduje szerokie re-rendery i prop drilling; niedostateczne podnoszenie powoduje zsynchronizowane duplikaty.
Biblioteka pytań rekrutacyjnych IT ze szczegółowymi odpowiedziami — od Juniora do Seniora.
Wesprzyj