लिफ्टिङ स्टेट अप भन्ने कुरा स्टेटलाई बाल कम्पोनेन्टबाट साझा अभिभावक मा सार्नु हो ताकि धेरै बाल कम्पोनेन्टहरूले एकै डेटासँग साझेदारी गर्न र समन्वय राख्न सक्न। यो मानक समाधान हो जब भाइ-बहिनी कम्पोनेन्टहरूलाई समन्वय गर्न आवश्यक हुन्छ।
() { [temp, setTemp] = (); ... }
यदि दुई भाइ-बहिनी कम्पोनेन्टहरूले प्रत्येकले आफ्नो सम्बन्धित स्टेटको प्रतिलिपि राखे भने, तिनीहरू सँग अनुरूप रहन कुनै तरिका छैन — एकलाई परिवर्तन गर्नुले अर्कोलाई असर गरेन।
function Calculator() {
const [temperature, setTemperature] = useState(0); // state LIFTED to the parent
return (
<>
{/* pass state DOWN as a prop, and a setter to update it */}
<TempInput scale="C" value={temperature} onChange={setTemperature} />
<TempInput scale="F" value={temperature} onChange={setTemperature} />
<p>Both inputs share one value: {temperature}</p>
</>
);
}
function TempInput({ value, onChange }) {
return <input value={value} onChange={e => onChange(e.target.value)} />;
}
साझा स्टेट अब अभिभावक (Calculator) मा बस्छ। यसले मान तल prop को रूपमा र setter पास गर्छ ताकि बाल कम्पोनेन्टहरूले परिवर्तनको अनुरोध गर्न सक्न (माथि)। अब दुवै इनपुटले एकै स्रोत प्रतिबिम्बित गर्छ — एकलाई सम्पादन गर्नुले दुवै अपडेट गर्छ।
1. Find the closest COMMON ancestor of the components that need to share
2. Move the state UP into that ancestor
3. Pass the value DOWN as props
4. Pass a callback DOWN so children can request updates (data up via events)
यो एकै "डेटा तल, घटनाहरू माथि" प्रवाह हो, स्टेट साझा गर्नको लागि लागू गरिएको।
Lifting too high (state ends up far from where it's used) → prop drilling.
At that point, prefer Context or a state library instead of lifting further.
लिफ्टिङ स्टेट अप भन्ने कुरा भाइ-बहिनी/सम्बन्धित कम्पोनेन्टहरू बीच स्टेट साझा गर्नु को मौलिक प्रविधि हो कम्पोनेन्ट-आधारित फ्रेमवर्कमा — यसले साझा अभिभावकमा सत्यको एकल स्रोत राख्छ ताकि बाल कम्पोनेन्टहरू समन्वयमा रहन्छन्।
यो Context वा store थप गर्नु अघि पहुँच गर्नको लागि अक्सर पहिलो उपकरण हो।
कहिले लिफ्ट गर्ने (भाइ-बहिनीहरूलाई समन्वय गर्न आवश्यक छ) — र कहिले लिफ्टिङ गएको छ (prop drilling को कारण, ताकि यो Context/store को समय हो) — भनेर पहिचान गर्नु कम्पोनेन्ट स्टेट राम्रोसँग संरचना गर्नको लागि मुख्य कुरा हो।
विस्तृत उत्तरसहित IT अन्तर्वार्ता प्रश्नहरूको पुस्तकालय — जुनियरदेखि सिनियरसम्म।
दान गर्नुहोस्