मैंने ( React.Component ) फेसबुक के प्रलेखन को देखा और इसमें उल्लेख componentWillMountकिया गया है कि क्लाइंट / सर्वर पर कैसे कॉल किया जाता है जबकि क्लाइंट पर ही इनवोकcomponentDidMount किया जाता है। componentWillMountसर्वर को क्या करना है?
मैंने ( React.Component ) फेसबुक के प्रलेखन को देखा और इसमें उल्लेख componentWillMountकिया गया है कि क्लाइंट / सर्वर पर कैसे कॉल किया जाता है जबकि क्लाइंट पर ही इनवोकcomponentDidMount किया जाता है। componentWillMountसर्वर को क्या करना है?
जवाबों:
कंपोनेंटमिल्टन मूल रूप से कंस्ट्रक्टर है। आप ऐसे उदाहरण गुण सेट कर सकते हैं जो रेंडर को प्रभावित नहीं करते हैं, एक स्टोर से डेटा को सिंक्रोनाइज़ करें और इसके साथ सेट करें, और अन्य सरल साइड इफेक्ट फ्री कोड जो आपको अपने घटक को सेट करते समय चलाने की आवश्यकता है।
यह शायद ही कभी जरूरत है, और ES6 वर्गों के साथ बिल्कुल नहीं है।
constructorविधि नहीं है के रूप में ही componentWillMount।
रेडक्स के लेखक के अनुसार, निर्माता से कार्यों को फैलाना जोखिम भरा है क्योंकि इसके परिणामस्वरूप राज्य को बदलते समय उत्परिवर्तन हो सकता है।
हालांकि, इससे प्रेषण componentWillMountठीक है।
से GitHub मुद्दे :
ऐसा तब होता है जब एक घटक के निर्माता के अंदर प्रेषण () दूसरे घटक के अंदर एक सेटस्टेट () का कारण बनता है। रिएक्ट ऐसे चेतावनियों के लिए "वर्तमान मालिक" का ट्रैक रखता है - और यह सोचता है कि हम निर्माणकर्ता के अंदर सेटस्टैट () को बुला रहे हैं जब तकनीकी रूप से निर्माता एप्लिकेशन के कुछ अन्य भाग के अंदर एक सेटस्टैट () का कारण बनता है। मुझे नहीं लगता कि हमें इसे संभालना चाहिए - यह सिर्फ रिएक्ट है जो अपना काम करने की पूरी कोशिश कर रहा है। समाधान है, जैसा कि आपने सही ढंग से नोट किया है, इसके बजाय घटक (डिल्डोमीटर के अंदर) प्रेषण ()।
FakeRainBrigand ने जो कहा, componentWillMountउसे जोड़ने के लिए सर्वर और क्लाइंट पर प्रतिक्रिया प्रदान करते समय कहा जाता है, लेकिन componentDidMountकेवल क्लाइंट पर कहा जाता है।
componentWillMountसर्वर और क्लाइंट पर कॉल किया जाएगा। देखें: facebook.github.io/react/docs/…
componentWillMountग्राहक पर बुलाया नहीं जाएगा
componentWillMountrenderएक घटक के संस्करण से पहले किया जाता है , और इसका उपयोग प्रॉप का आकलन करने और उनके आधार पर कोई भी अतिरिक्त तर्क करने के लिए किया जाता है (आमतौर पर राज्य को अद्यतन करने के लिए भी), और जैसे कि सर्वर पर प्रदर्शन किया जा सकता है ताकि पहले सर्वर की ओर से मार्कअप प्रदान किया जा सके। ।
componentDidMountrenderDOM के अपडेट होने के बाद प्रारंभिक रूप से प्रदर्शन किया जाता है (लेकिन महत्वपूर्ण रूप से इस DOM अपडेट को ब्राउज़र में चित्रित किया गया है, जिससे आप DOM के साथ सभी प्रकार के उन्नत इंटरैक्शन कर सकते हैं)। यह निश्चित रूप से केवल ब्राउज़र में ही हो सकता है और इसलिए SSR के भाग के रूप में नहीं होता है, क्योंकि सर्वर केवल मार्कअप उत्पन्न कर सकता है और स्वयं DOM नहीं, यह SSR का उपयोग करने पर ब्राउज़र को भेजे जाने के बाद किया जाता है।
DOM के साथ उन्नत बातचीत जो आप कहते हैं? Whaaaat ?? ... Yep - इस बिंदु पर क्योंकि DOM को अपडेट कर दिया गया है (लेकिन उपयोगकर्ता ने अभी तक ब्राउज़र में अपडेट नहीं देखा है) यह संभव है कि वास्तविक पेंटिंग का उपयोग करके स्क्रीन पर इंटरसेप्ट करें window.requestAnimationFrameऔर फिर वास्तविक चीज़ों को मापें DOM तत्व जो आउटपुट होंगे, जिनके लिए आप आगे के राज्य परिवर्तन कर सकते हैं, उदाहरण के लिए सुपर उपयोगी एक तत्व की ऊंचाई के लिए जो कि अज्ञात चर लंबाई सामग्री है (जैसा कि अब आप सामग्री को माप सकते हैं और एनीमेशन को एक ऊंचाई असाइन कर सकते हैं), या कुछ राज्य परिवर्तन के दौरान सामग्री परिदृश्यों के फ्लैश से बचने के लिए।
किसी भी स्थिति में राज्य परिवर्तनों की रक्षा करने के लिए बहुत सावधान रहें, componentDid...अन्यथा एक अनंत लूप का कारण बन सकता है क्योंकि एक राज्य परिवर्तन भी पुन: रेंडर का कारण होगा, और इसलिए एक componentDid...और पर और पर और पर।
setStateसे componentDidMountअनंत लूप पैदा होगा।
componentDidMountबार-बार आह्वान नहीं करेगा । कंपोनेंटडिमाउंट केवल एक बार कहा जाता है जब कंपोनेंट माउंट हो जाता है।
प्रलेखन के अनुसार ( https://facebook.github.io/react/docs/react-component.html )
कुछ होने से पहले उपसर्गों को सही कहा जाएगा और
उपसर्ग के साथ तरीके था आर कहा जाता है ight के बाद कुछ होता है।
ComponentsWillMount https://daveceddia.com/where-fetch-data-componentwillmount-vs-componentdidmount/
हालांकि, एक "गेटचा" है: डेटा लाने के लिए एक अतुल्यकालिक कॉल रेंडर होने से पहले वापस नहीं आएगा। इसका मतलब है कि घटक खाली डेटा के साथ कम से कम एक बार प्रस्तुत करेगा।
डेटा के आने का इंतजार करने के लिए "ठहराव" प्रदान करने का कोई तरीका नहीं है। आप किसी घटक से वादा वापस नहीं कर सकते हैं या किसी सेटटाइमआउट में किसी भी तरह से खराब हो सकते हैं।
हमारे घटक के पास मूल निवासी UI (DOM, आदि) तक पहुंच नहीं होगी। हमारे पास बच्चों के रेफरी तक पहुंच नहीं होगी, क्योंकि वे अभी तक नहीं बने हैं। घटकविल्माउंट () हमारे लिए कॉन्फ़िगरेशन को संभालने, हमारे राज्य को अपडेट करने और सामान्य रूप से पहले रेंडर के लिए तैयार करने का एक मौका है। इसका अर्थ है कि हम मूल मानों के आधार पर गणना या प्रक्रियाएं करना शुरू कर सकते हैं।
घटक के लिए उपयोग-केसमाउंट ()
उदाहरण के लिए, यदि आप घटक घटक में निर्मित होने की तिथि रखना चाहते हैं, तो आप इसे इस विधि में सेट कर सकते हैं। कृपया ध्यान रखें कि इस पद्धति में स्थिति सेट करने से DOM को फिर से प्रस्तुत नहीं किया जा सकेगा। यह ध्यान में रखना महत्वपूर्ण है, क्योंकि ज्यादातर मामलों में जब भी हम घटक की स्थिति बदलते हैं, तो एक पुन: रेंडर को ट्रिगर किया जाता है।
componentWillMount() {
this.setState({ todayDate: new Date(Date.now())});
}कंपोनेंट के लिए केस-केसमाउंट ()
उदाहरण के लिए, यदि आप एक समाचार ऐप बना रहे थे, जो वर्तमान समाचारों पर डेटा प्राप्त करता है और इसे उपयोगकर्ता को प्रदर्शित करता है और आप चाहते हैं कि यह डेटा हर घंटे अपडेट किया जाए, तो उपयोगकर्ता पृष्ठ को रीफ्रेश किए बिना।
componentDidMount() {
this.interval = setInterval(this.fetchNews, 3600000);
}
componentXxxMount, उदाहरण के लिए, अजाक्सwillMountमुद्दों का कारण बन सकता है।