İki bileşenin aynı state'i paylaşması gerektiğinde, bu state'i en yakın ortak ancestor'a taşır ("kaldırır") ve props aracılığıyla aşağıya aktarırsınız, böylece tek bir gerçek kaynağı olur.
jsx
() {
[query, setQuery] = ();
(
);
}
İki bileşenin aynı state'i paylaşması gerektiğinde, bu state'i en yakın ortak ancestor'a taşır ("kaldırır") ve props aracılığıyla aşağıya aktarırsınız, böylece tek bir gerçek kaynağı olur.
() {
[query, setQuery] = ();
(
);
}
Junior'dan Senior'a detaylı cevaplarla bir BT mülakat soruları kütüphanesi.
Bağış YapEğer her child kendi query başlangıcını tutsaydı, senkronizasyonu kaybederlerdi. State'i kaldırmak, giriş ve sonuçların her zaman uyumlu olduğu anlamına gelir.
State'i yüksekte tutmak, sizi birçok ara bileşenden props geçmeye zorlayabilir; bu bileşenler onları kullanmaz:
<App user={user}>
<Layout user={user}> {/* just forwarding */}
<Sidebar user={user}> {/* just forwarding */}
<Avatar user={user} /> {/* finally used here */}
children olarak geçirin, böylece veriler çevrim yapılmak yerine kullanıldıkları yerde kalır.Yönlendirici ilke: state'i yalnızca ihtiyacı kadar yüksekte tutun — daha yüksekte değil. Aşırı yükselme, geniş re-render'lar ve prop drilling'e neden olur; eksik yükselme, senkron dışı kopyalara neden olur.