2015-11-12 11 views
6

मैं किसी घटक की key संपत्ति का उपयोग कैसे कर सकता हूं। मैंने सोचा कि यह इस में होगा .props लेकिन यह नहीं है।रिएक्शन घटक से "कुंजी" संपत्ति का उपयोग कैसे करें

उदा।

 <ProductList 
       key = {list.id} 
       listId = {list.id} 
       name = {list.name} 
       items = {list.items} 
     /> 

और उत्पाद सूची में अगर मैं

console.log(this.props)

रिटर्न

Object {listId: "list1", name: "Default", items: Array[2]} 

सभी में कोई कुंजी संपत्ति के साथ करते हैं। मैं एक और संपत्ति बना सकता हूं और उसी मूल्य को असाइन कर सकता हूं, लेकिन यह अनावश्यक लगता है क्योंकि मुख्य संपत्ति का उपयोग पहले से ही किया जा रहा है।

साथ ही, क्या मुख्य संपत्ति को पूरे घटक में अद्वितीय होना चाहिए, या केवल लूप या संग्रह में इसे प्रस्तुत किया जा रहा है?

उत्तर

12

key संपत्ति हुड के तहत प्रतिक्रिया द्वारा उपयोग की जाती है, और यह आपके सामने नहीं आती है। आप एक कस्टम प्रॉपर्टी का उपयोग करना चाहते हैं और उस डेटा को पास करना चाहते हैं। मैं एक अर्थपूर्ण अर्थपूर्ण संपत्ति नाम की सिफारिश करता हूं; key केवल सुलह के दौरान एक डोम नोड की पहचान करने में मदद करने के लिए है, इसलिए listId नामक एक और संपत्ति होने का अर्थ है।

key संपत्ति को पूरे घटक के लिए अद्वितीय होने की आवश्यकता नहीं है, लेकिन मेरा मानना ​​है कि यह उस घोंसले के स्तर के लिए अद्वितीय होना चाहिए (आमतौर पर लूप या संग्रह)। यदि प्रतिक्रिया डुप्लिकेट key एस (विकास निर्माण में) के साथ किसी समस्या का पता लगाती है, तो यह एक त्रुटि फेंक देगी:

Warning: flattenChildren(...): Encountered two children with the same key, .$a . Child keys must be unique; when two children share a key, only the first child will be used.

संबंधित मुद्दे