React
कैसे और क्यों प्रतिक्रिया में चाबियाँ का उपयोग करने के लिए
खोज…
परिचय
जब भी आप प्रतिक्रिया घटकों की एक सूची प्रदान कर रहे हैं, प्रत्येक घटक के लिए एक key विशेषता होनी चाहिए। कुंजी का कोई भी मूल्य हो सकता है, लेकिन इसके लिए उस सूची का विशिष्ट होना आवश्यक है।
जब React को आइटमों की सूची में परिवर्तन प्रस्तुत करना पड़ता है, तो React बस एक ही समय में बच्चों की दोनों सूचियों पर पुनरावृत्ति करता है और जब भी कोई अंतर होता है, तो उत्परिवर्तन उत्पन्न करता है। यदि बच्चों के लिए कोई कुंजी निर्धारित नहीं है, तो रिएक्ट प्रत्येक बच्चे को स्कैन करता है। अन्यथा, रिएक्ट उन कुंजियों की तुलना करता है जो सूची में जोड़े गए या हटाए गए थे
टिप्पणियों
अधिक जानकारी के लिए, कुंजियों का उपयोग करने के तरीके को पढ़ने के लिए इस लिंक पर जाएँ: https://facebook.github.io/react/docs/lists-and-keys.html
और यह पढ़ने के लिए इस लिंक पर जाएं कि कुंजियों का उपयोग करने की अनुशंसा क्यों की जाती है: https://facebook.github.io/react/docs/reconciliation.html#recashing-on-children
मूल उदाहरण
कक्षा-कम प्रतिक्रिया घटक के लिए:
function SomeComponent(props){
const ITEMS = ['cat', 'dog', 'rat']
function getItemsList(){
return ITEMS.map(item => <li key={item}>{item}</i>);
}
return (
<ul>
{getItemsList()}
</ul>
);
}
इस उदाहरण के लिए, उपरोक्त घटक निम्नानुसार है:
<ul>
<li key='cat'>cat</li>
<li key='dog'>dog</li>
<li key='rat'>rat</li>
<ul>