react · JavaScript
संदेश
Each child in a list should have a unique "key" prop.
इसका मतलब
सूची के रूप में दिखाए गए सहोदर तत्वों पर key नहीं है, इसलिए अगले render में React उन्हें उन्हीं वस्तुओं से जोड़ नहीं सकता। आपने items.map(...) से तत्व बनाए और key छोड़ दिया; यह केवल चेतावनी है, परदा बन जाता है, पर सूची बदलने पर यह चुपचाप गड़बड़ी बनकर लौटता है — लक्षण यह कि किसी input का मान या कोई animation ग़लत पंक्ति पर रह जाता है। अपने डेटा से कोई स्थिर id दें। array के index को key बनाना केवल उसी सूची में सुरक्षित है जिसका क्रम कभी नहीं बदलता और जिसमें बीच में कुछ जोड़ा या हटाया नहीं जाता; वरना वह लगभग वही समस्या दोहराता है जो key न होने से होती है। React 19 से शुरुआत में लगने वाला Warning: हट गया है।
सुधार
इसका एक-लाइन कमांड नहीं है। व्याख्या में लिखा है कि क्या देखना है।
- कौन देता है
- react
- JavaScript
- 15
browser और node की त्रुटियाँ आमतौर पर यही बताती हैं कि क्या टूटा, यह नहीं कि वह मान ऐसा क्यों बना — आपने undefined पढ़ा, वह function नहीं था, वह JSON नहीं था — इसलिए सुधार की जगह उस पंक्ति से ऊपर है जिसने त्रुटि फेंकी, और ?. तथा डिफ़ॉल्ट मानों से केवल उस पंक्ति को चुप कराने पर वही समस्या और दूर जाकर, और कठिन रूप में लौट आती है।
एरर संदेश कैसे पढ़ें
- पहली पंक्ति से पढ़ें। जितना नीचे जाएँगे उतना वह औज़ार के भीतर की बात है; कारण आम तौर पर सबसे ऊपर लिखा होता है।
- फ़ाइल का नाम और पंक्ति संख्या दिखे तो वहीं से शुरू करें — stack का सबसे ऊपरी frame नहीं, बल्कि वह सबसे ऊपरी पंक्ति जिसमें आपकी लिखी फ़ाइल का नाम हो।
- संदेश को जैसा है वैसा खोजें, पर पहले अपने paths और variable नाम हटा दें — वही खोज को अटकाते हैं।
- वही स्थिति औज़ार के हर संस्करण में अलग शब्दों में आती है। नतीजे बेमेल लगें तो संस्करण संख्या भी जोड़ें।
- कोई सुधार चिपकाने से पहले देख लें कि वह क्या फेंक देगा। इनमें कुछ पलटे नहीं जा सकते।
अक्सर पूछे जाने वाले सवाल
Q. “Each child in a list should have a unique "key" prop.” का क्या मतलब है?
सूची के रूप में दिखाए गए सहोदर तत्वों पर key नहीं है, इसलिए अगले render में React उन्हें उन्हीं वस्तुओं से जोड़ नहीं सकता। आपने items.map(...) से तत्व बनाए और key छोड़ दिया; यह केवल चेतावनी है, परदा बन जाता है, पर सूची बदलने पर यह चुपचाप गड़बड़ी बनकर लौटता है — लक्षण यह कि किसी input का मान या कोई animation ग़लत पंक्ति पर रह जाता है। अपने डेटा से कोई स्थिर id दें। array के index को key बनाना केवल उसी सूची में सुरक्षित है जिसका क्रम कभी नहीं बदलता और जिसमें बीच में कुछ जोड़ा या हटाया नहीं जाता; वरना वह लगभग वही समस्या दोहराता है जो key न होने से होती है। React 19 से शुरुआत में लगने वाला Warning: हट गया है।
Q. इसे कैसे ठीक करें?
एक-लाइन कमांड नहीं है। ऊपर की व्याख्या में लिखा है कि क्या देखना है।
Q. यह कौन-सा औज़ार देता है?
react। यह JavaScript में आता है, और संदेश 11 शब्दों का है।