جب دو کمپوننٹس کو ایک جیسی state شیئر کرنی ہو، تو آپ اس state کو ان کے قریب ترین مشترک ancestor تک منتقل ("اٹھا") دیتے ہیں اور اسے props کے ذریعے نیچے پاس کرتے ہیں، تاکہ سچائی کا ایک واحد ذریعہ ہو۔
() {
[query, setQuery] = ();
(
);
}
اگر ہر child اپنا query رکھتا، تو وہ سنکرونائزیشن سے باہر ہو جاتے۔ اسے اٹھانا مطلب ہے کہ input اور نتائج ہمیشہ متفق رہیں۔
State کو زیادہ اوپر اٹھانا آپ کو بہت سے درمیانی کمپوننٹس کے ذریعے props پاس کرنے پر مجبور کر سکتا ہے جو انہیں استعمال نہیں کرتے:
<App user={user}>
<Layout user={user}> {/* just forwarding */}
<Sidebar user={user}> {/* just forwarding */}
<Avatar user={user} /> {/* finally used here */}
children کے طور پر پاس کریں تاکہ ڈیٹا وہیں رہے جہاں اسے استعمال کیا جاتا ہے، thread کرنے کی بجائے۔ہدایت کا اصول: state کو صرف اتنا اوپر اٹھائیں جتنا ضروری ہو — اس سے زیادہ نہیں۔ زیادہ اٹھانا وسیع re-renders اور prop drilling کا سبب بنتا ہے؛ کم اٹھانا مطابقت سے باہر نقول کا سبب بنتا ہے۔