प्रतिक्रिया में राज्यव्यापी और स्टेटलेस घटक को अलग करने के लिए लाइन कहां होनी चाहिए?

Question

प्रतिक्रिया encourages जितना संभव हो सके स्टेटलेस घटकों का उपयोग करें और उनके पास एक राज्यव्यापी मूल घटक हैं। मैं समझता हूं कि यह स्टेटलेस घटकों को अधिक पुन: प्रयोज्य और प्रबंधित करने में आसान बना सकता है। हालांकि, चरम पर, हम हमेशा राज्य को शीर्ष स्तर के घटक, जैसे App.js पर डाल सकते हैं, और लंबी प्रोप श्रृंखला के माध्यम से जानकारी और कॉलबैक पास कर सकते हैं। और यदि फ्लक्स का उपयोग करते हैं, तो क्रियाओं को हमेशा इसमें भी प्रेषित किया जा सकता है (कॉलबैक के माध्यम से निष्पादित)।

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

--- एक उदाहरण जोड़े ---

मैं वेब अनुप्रयोग की तरह एक गूगल डॉक्स एक उपकरण पट्टी है और सामग्री प्रदर्शित करता है कहो। मुझे कल्पना है कि हमारे पास घटक संरचना होगी।

<App> 
    <Toolbar /> 
    <Content /> 
</App> 

टूल बार में बटन हैं जो प्रदर्शन सामग्री को प्रभावित करेंगे, बोल्ड टेक्स्ट बटन कहें।

तो क्या ऐप को टूलबार पर कॉलबैक दबाए गए कॉलबैक प्रोप पर जाना चाहिए और स्वयं क्रियाएं प्रेषित करनी चाहिए, या टूलबार को इसे स्वयं करने देना चाहिए?

क्या ऐप सामग्री को पास करना चाहिए सामग्री के लिए स्ट्रिंग प्रोप, या सामग्री को स्टोर स्टोर में ही सुनना चाहिए?

धन्यवाद!

Answer 1

देखने की मेरी बात से, एक सरल अनुप्रयोग है कि रास्ते में फ्लक्स के पैटर्न इस्तेमाल कर सकते हैं:

1. बच्चे कार्रवाई फेंकना।
2. एप्लिकेशन संसाधित डेटा को अपने बच्चों को स्टोर और प्रसारित करने के लिए सुनता है।

उस दृष्टिकोण के साथ, आपके पास स्टेटलेस घटक है, लेकिन कॉलबैक प्रोप के बिना एक अच्छा कोड संगठन है। लेकिन आपके दोनों प्रस्ताव भी सही हैं, यह एक निर्णय है जिसे आप अपने आवेदन के आकार और आवश्यकताओं के बारे में बताते हैं।

यदि आपके द्वारा बनाए गए घटक का उपयोग आपके आवेदन के बाहर किया जाएगा, जितना संभव हो उतना प्रवाह का उपयोग न करें और डेवलपर को अपनी आवश्यकताओं के लिए इच्छित दृष्टिकोण चुनने दें।

Answer 2

यह एक अच्छा सवाल है, और इसे विभिन्न प्रवाह कार्यान्वयन के बीच भी अलग-अलग हल किया जा रहा है।

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

कार्यों के संबंध में - मैं कॉलबैक प्रोप के साथ अपने सभी "गूंगा" विज़ुअलाइज़ेशन/यूई/डिस्प्ले घटक काम करना पसंद करता हूं। इस तरह उन्हें फिर से उपयोग करना आसान है, और यह चिंताओं का एक अच्छा अलगाव है। समृद्ध घटकों में जो व्यवसायिक तर्क का थोड़ा सा हिस्सा रखते हैं, मैं सीधे रेफ्लक्स क्रियाओं को कॉल करता हूं। आम तौर पर वे उपरोक्त "गूंगा" यूई नियंत्रकों के लिए कंटेनर घटक भी होते हैं।

तो लब्बोलुआब यह है - डेटा जितना संभव हो उच्च से प्रवाह चाहिए, कार्यों कम घटकों से निकाल दिया जा सकता है, लेकिन हमेशा देखना होगा कि आपने कॉलबैक रंगमंच की सामग्री के साथ एक ही परिणाम प्राप्त कर सकते हैं।

अपने प्रश्न के लिए - टूलबार का अपना ToolbarActions है और उन्हें सीधे फोन करने के लिए एक जटिल पर्याप्त घटक है। लेकिन सामग्री घटक निश्चित रूप से ऊपर से अपने डेटा मिलना चाहिए। यह भी डेटा कि जिस तरह से प्रवाह तर्क करने जब एप्लिकेशन जटिल हो जाता है आसान है।

उम्मीद है कि मदद करता है। पूरे फ्लक्स बात अभी भी प्रगति में एक कला है ...