React डॉक्स को क्यों करता है AJAX को कंपोनेंटडिमाउंट में करने की सलाह देते हैं, न कि कंपोनेंटमाउंट को?


102

शीर्षक ही सब कुछ कह देता है। मैं समझता हूं componentDidMountकि DOM एक्सेस की आवश्यकता वाली किसी भी चीज़ के लिए उपयुक्त क्यों है, लेकिन AJAX अनुरोध के लिए या आमतौर पर इसकी आवश्यकता नहीं है।

क्या देता है?


@FurkanO मुझे लगता है कि वह घटक द्वारा प्रस्तुत DOM तत्वों तक पहुंच का मतलब है। और वह पूरी तरह से सही है क्योंकि अगर आप componentWillMountयह कह सकते हैं कि इसमें मौजूद तत्वों को एक्सेस करने का प्रयास किया जाएगा , तो यह विफल हो जाएगा कि घटक ... माउंट नहीं किया गया था।
ज़ेकेरॉइड

@AlanH। मेरे प्रश्न को हटा दिया, बेशक आप घटक पर पहुँच है। यह एक नियम है, इसके बारे में समझाने के लिए कुछ नहीं। धन्यवाद।
फुरकानो

मेरी राय में, क्यों हम घटक के बाद Ajax फ़ंक्शन कहते हैं, क्या हमें पहले यह सुनिश्चित करना होगा कि तत्व शुरुआत में आसानी से प्रस्तुत कर रहा है। उसके बाद हम अजाक्स कॉल कर सकते हैं। अगर हम पहले अजाक्स कहते हैं और कुछ त्रुटि होती है तो यह प्रतिपादन में समस्या पैदा करेगा
फारिस रेहान

जवाबों:


62

componentDidMountसाइड इफेक्ट के लिए है। इवेंट श्रोता, AJAX, DOM को म्यूट करना आदि जोड़ना।

componentWillMountशायद ही कभी उपयोगी है; खासकर यदि आप सर्वर साइड रेंडरिंग के बारे में परवाह करते हैं (इवेंट श्रोताओं को जोड़ने से त्रुटियों और लीक होती है, और बहुत सारे अन्य सामान जो गलत हो सकते हैं)।

componentWillMountक्लास के घटकों को हटाने के बारे में चर्चा है क्योंकि यह कंस्ट्रक्टर के समान उद्देश्य को पूरा करता है। यह createClassघटकों पर रहेगा ।


1
ईवेंट श्रोताओं को जोड़ने से सर्वर पर हर समय या केवल लीक में त्रुटियां और लीक होती हैं componentWillMount? मैं वास्तव में भेद नहीं देखता।
एलन एच।

18
@Alan - यदि आप दोनों क्लाइंटसाइड और सर्वरसाइड पर रिएक्ट का उपयोग कर रहे हैं, तो आप पाएंगे कि अंदर कुछ भी componentWillMountसर्वराइड रेंडर पर निष्पादित किया जाएगा। यदि आप उपयोग कर रहे थे तो वेश्या componentDidMountको केवल क्लाइंटसाइड पर निष्पादित किया जाएगा। नतीजतन चीजों को componentWillMountबाहरी संपर्क में रखना या घटनाओं आदि के लिए बाध्य करना, एक महान विचार नहीं है। यदि आपके पास सर्वरसाइड पर अपने घटकों को प्रस्तुत करने की कोई योजना नहीं है, तो यह अभी भी संभावित कोड पोर्टेबिलिटी के लिए एक अच्छा विचार नहीं है। यह सब मुख्य कारण के बाहर है जो खराब है जो @daniula के उत्तर में समझाया गया है।
माइक चालक

3
घटकWillMount सर्वर पर चलाया जाता है, लेकिन घटकWillUnmount (जहाँ आप श्रोताओं को हटाते हैं) नहीं है। इससे आपको श्रोताओं को जोड़ना होगा और उन्हें कभी साफ़ नहीं करना होगा।
ब्रिगैंड

रिएक्ट कोर टीम के लोग भविष्य के संस्करणों से कंपोनेंटविल को हटाने पर विचार कर रहे हैं।
cchamberlain

1
@AnkitSinghaniya यह सर्वर रेंडरिंग और उथले यूनिट टेस्ट को तोड़ देगा।
ब्रिगैंड

36

मैं शुरुआत में भी यही मुद्दा था। मैंने एक कोशिश करने का अनुरोध करने का फैसला किया, componentWillMountलेकिन यह विभिन्न छोटे मुद्दों में समाप्त होता है।

जब अजाक्स कॉल नए डेटा के साथ समाप्त होता है, तो मैं प्रतिपादन को ट्रिगर कर रहा था। कुछ बिंदु पर घटक के प्रतिपादन में सर्वर से प्रतिक्रिया मिलने में अधिक समय लगता है और इस बिंदु पर अजाक्स कॉलबैक अनमाउंट किए गए घटक पर रेंडरिंग को ट्रिगर कर रहा था। यह एक प्रकार का एज केस है, लेकिन संभवतः अधिक है, इसलिए इसे छड़ी करना अधिक सुरक्षित है componentDidMount


ठीक है शुक्रिया। सोचा कि यह कुछ ऐसा हो सकता है, लेकिन आप सही हैं, यह आश्चर्यजनक है कि अजाक्स अनुरोध रेंडर करने से पहले समाप्त हो सकता है।
एलन एच।

1
@daniula क्या आपको यकीन है? रेंडर करने से पहले AJAX अनुरोध कैसे पूरा हो सकता है?
लियोन ग्रेपेंथिन

4
यह ब्राउज़र अतुल्यकालिक दुनिया है। आपको कभी भी यह नहीं समझना चाहिए कि एक फ़ंक्शन हमेशा तेज होगा, फिर बाकी। जैसा कि मैंने उल्लेख किया है कि यह एज केस है और शायद इसका मतलब है कि आपको अपनी रेंडरिंग प्रक्रिया को अनुकूलित करना चाहिए लेकिन उचित जीवनचक्र पद्धति का उपयोग करने से इस बिंदु पर आपके जीवन को बहुत आसान बना दिया जाएगा।
दानीउल २१'१५ को

1
@SooChengKoh ES6 क्लास कंस्ट्रक्टर के बराबर है componentWillMount, इसलिए आपको अभी भी componentDidMountअपने अजाक्स कॉल के लिए उपयोग करते रहना चाहिए ।
दानीूला

1
@SooChengKoh - निश्चित रूप से कंस्ट्रक्टर में ऐसा कुछ भी नहीं करना चाहिए जिससे राज्य स्थापित हो सके, जो क्लाइंट और सर्वर पर दौड़ की स्थिति पैदा करेगा। आपको setStateएक घटक निर्माता में कभी भी कॉल नहीं करना चाहिए और आपके पास यह निर्धारित करने का कोई तरीका नहीं है कि AJAX कॉल कब पूरा होगा। twitter.com/dan_abramov/status/576453138598723585
cchamberlain

3

राज्य को स्थापित करने वाले प्रलेखन के अनुसार, componentWillMountकोई पुन: प्रतिपादन ट्रिगर नहीं करेगा। यदि AJAX कॉल ब्लॉक नहीं हो रही है और आप Promiseउस अपडेट को घटक की स्थिति को सफलता पर लौटाते हैं, तो संभावना है कि घटक के प्रस्तुत होने के बाद प्रतिक्रिया आती है। जैसा कि componentWillMountआप एक पुन: रेंडर को ट्रिगर नहीं करते हैं, आपके पास वह व्यवहार नहीं होगा जिसकी आपको उम्मीद थी कि अनुरोधित डेटा के साथ घटक प्रदान किया जा रहा है।

यदि आप फ्लक्स लाइब्रेरी में से किसी का उपयोग करते हैं और स्टोर में डेटा का अनुरोध किया जाता है, तो घटक जुड़ा हुआ है (या एक जुड़े घटक से विरासत में) यह उस डेटा के स्वागत के रूप में एक मुद्दा नहीं होगा, सबसे अधिक संभावना है, बदलने का सहारा। अंत में।


1
componentWillMountएक नए राज्य को पहले रेंडर करने से पहले परिभाषित करने के कारण सिर्फ एक रेंडर को ट्रिगर नहीं करता है। लेकिन अगर setStateएक AJAX कॉलबैक में कहा जाता है, तो यह निश्चित रूप से पहले रेंडर के बाद बुलाया जाएगा, और यह फिर से रेंडर करेगा।
webdif
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.