React: चर नई तिथि को संदर्भित करता है () एक बाल तत्व नहीं हो सकता है।

को निर्मित 17 अक्तू॰ 2016 · 3टिप्पणियाँ · स्रोत: facebook/react

मैं React Quickly पुस्तक से एक कोड स्निपेट का अनुसरण कर रहा हूं।
और मैं बेबेल के माध्यम से संकलित होने के बाद कोड नहीं चला सकता।
मेरे कोड की तरह है:

class DateTimeNow extends React.Component{
    render(){
        let dateTimeNow = new Date();
        return <span>Current date and time is {dateTimeNow}.</span>;
    }
}
ReactDOM.render(
    <DateTimeNow/>,
    document.getElementById('content')
);

ब्राउज़र द्वारा रिपोर्ट किया गया त्रुटि संदेश है:
Uncaught Invariant Violation: Objects are not valid as a React child (found: Mon Oct 17 2016 09:12:00 GMT+0800 (CST)). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of डेटटाइम अब .

क्या आप कृपया उत्तर देने में मदद कर सकते हैं कि यह त्रुटि क्यों पैदा करेगा?
आपका बहुत बहुत धन्यवाद!

क्या आप _feature_ का अनुरोध करना चाहते हैं या _bug_ की रिपोर्ट करना चाहते हैं?

वर्तमान व्यवहार क्या है?
त्रुटि संदेश: अनकैप्ड इनवेरिएंट उल्लंघन: ऑब्जेक्ट एक प्रतिक्रिया बच्चे के रूप में मान्य नहीं हैं (पाया गया: सोम अक्टूबर 17 2016 09:12:00 GMT+0800 (CST))। यदि आप बच्चों के संग्रह को प्रस्तुत करना चाहते हैं, तो इसके बजाय एक सरणी का उपयोग करें या प्रतिक्रिया ऐड-ऑन से createFragment(object) का उपयोग करके ऑब्जेक्ट को लपेटें। DateTimeNow की रेंडर विधि जांचें।

यदि वर्तमान व्यवहार एक बग है, तो कृपया https://jsfiddle.net या समान (टेम्पलेट: https://jsfiddle.net/reactjs/69z2wepo/) के माध्यम से पुन: पेश करने के लिए कदम प्रदान करें और यदि संभव हो तो समस्या का एक न्यूनतम डेमो प्रदान करें।

अपेक्षित व्यवहार क्या है?
अवधि टैग वर्तमान समय प्रदर्शित करता है
रिएक्ट के कौन से संस्करण, और कौन से ब्राउज़र/ओएस इस समस्या से प्रभावित हैं?
प्रतिक्रिया 15.3.2

स्रोत

krave1986

सबसे उपयोगी टिप्पणी

संक्षिप्त उत्तर यह है कि आपको अपनी dateTimeNow चर पर toString() विधि को कॉल करने की आवश्यकता है, क्योंकि यह दिनांक _object_ है, न कि एक स्ट्रिंग। यानी 'ऑब्जेक्ट्स' में से एक त्रुटि संदेश का जिक्र है।

return <span>Current date and time is {dateTimeNow.toUTCString()}.</span>;

उस ने कहा, त्रुटि संदेश शुरू में भ्रमित करने वाला है क्योंकि यह केवल एक स्ट्रिंग के रूप में तारीख को प्रस्तुत करता है। उदाहरण के लिए यदि आप {dateTimeNow} को किसी वस्तु जैसे { {a: 1} } प्रतिस्थापित करते हैं, तो त्रुटि संदेश थोड़ा अधिक समझ में आता है:

Uncaught Error: Objects are not valid as a React child (found: object with keys {a}).

colw 17 अक्तू॰ 2016

👍5

सभी 3 टिप्पणियाँ

return <span>Current date and time is {dateTimeNow.toUTCString()}.</span>;

Uncaught Error: Objects are not valid as a React child (found: object with keys {a}).

colw 17 अक्तू॰ 2016

👍5

https://github.com/facebook/react/issues/7988#issuecomment -254148427 सही है।

जेएस में तिथियां ऑब्जेक्ट हैं, लेकिन आपके रेंडर आउटपुट में केवल रिएक्ट तत्व, स्ट्रिंग्स और संख्याएं हो सकती हैं। किसी भी toString() जैसी विधि के साथ एक स्ट्रिंग को प्रारूपित करना काम करेगा।

आप MDN पर ऐसी विधियों की सूची पा सकते हैं।

चीयर्स!

gaearon 17 अक्तू॰ 2016

रिएक्ट हमारे लिए .toString() को स्वचालित रूप से एक ला स्ट्रिंग इंटरपोलेशन क्यों नहीं कर सकता है? बहुत ज्यादा ओवरहेड?

ipsips 7 जून 2019

👍4

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

React: चर नई तिथि को संदर्भित करता है () एक बाल तत्व नहीं हो सकता है।

सबसे उपयोगी टिप्पणी

सभी 3 टिप्पणियाँ

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