जेव्हा दोन घटकांना समान स्टेट शेअर करावी लागते, तुम्ही त्या स्टेटला ("लिफ्ट") त्यांच्या सर्वात जवळच्या सामान्य ancestor पर्यंत हलवता आणि props द्वारे खाली पास करता, जेणेकरून एकच सत्य स्रोत असतो।
jsx
() {
[query, setQuery] = ();
(
);
}
जेव्हा दोन घटकांना समान स्टेट शेअर करावी लागते, तुम्ही त्या स्टेटला ("लिफ्ट") त्यांच्या सर्वात जवळच्या सामान्य ancestor पर्यंत हलवता आणि props द्वारे खाली पास करता, जेणेकरून एकच सत्य स्रोत असतो।
() {
[query, setQuery] = ();
(
);
}
जर प्रत्येक child ने स्वतःचे query ठेवले, तर ते सिंक्रोनाइজ होऊन जाऊ शकते. लिफ्टिंग याचा अर्थ असा आहे की input आणि परिणाम नेहमी सहमत असतात.
स्टेट उच्च असे लिफ्ट करणे तुम्हाला अनेक मध्यवर्ती घटकांद्वारे props पास करण्यास भाग पाडू शकते जे त्यांना वापरत नाहीत:
<App user={user}>
<Layout user={user}> {/* just forwarding */}
<Sidebar user={user}> {/* just forwarding */}
<Avatar user={user} /> {/* finally used here */}
children म्हणून पास करा जेणेकरून डेटा त्यथे राहील जिथे हा वापरला जातो याऐवजाय त्याला thread करण्याऐवजी.मार्गदर्शन तत्त्व: स्टेट फक्त तेवढे उच्च लिफ्ट करा जितके हवे आहे — अधिक नाही. Over-lifting व्यापक re-renders आणि prop drilling कारण बनवते; under-lifting out-of-sync duplicates कारण बनवते.
सविस्तर उत्तरांसह IT मुलाखत प्रश्नांचे ग्रंथालय — Junior पासून Senior पर्यंत.
देणगी द्या