8
मैंने हाल ही में प्रतिक्रिया सीखना शुरू कर दिया है और मुझे तुरंत कार्यों और राज्य से भरे हुए ब्लोएटेड पैरेंट घटक की समस्या का सामना करना पड़ा। सबसे पहले मैंने फ्लक्स को देखा और फिर मैंने रेडक्स को देखा लेकिन दोनों वास्तव में समाधानों की तरह लग रहे थे।रेडक्स वैकल्पिक
क्यों कुछ इस तरह से नहीं किया है मैं सोच रहा हूँ:
//EventPropagator.js
let EventPropagator = {
registerListener(listenerObject){
if (this.listeners == null)
this.listeners = []
this.listeners.push(listenerObject)
},
fireEvent(eventObject){
let listenerList = this.listeners.filter(function(listener){
return listener.eventType === eventObject.eventType
})
listenerList.forEach((listener) => {
listener.callback(eventObject.payload)
})
}
}
export default EventPropagator
का उपयोग करें: घटकों बस registerListener और fireEvent:
//main.js
import EventPropagator from './events/EventPropagator'
EventPropagator.registerListener({
"eventType": "carry_coconut",
"callback": (payload) => {
// actually carry coconut
this.setState({"swallow_type": payload.swallow})
console.log(payload)
}
})
EventPropagator.fireEvent({
"eventType": "carry_coconut",
"payload": { "swallow": "african" }
})
इस decoupling और राज्य कर सकता का एक बहुत की अनुमति होगी इस तरह के आयोजन के साथ आसानी से पारित किया जा सकता है। इस दृष्टिकोण के लिए डाउनसाइड्स क्या हैं?
Jumpstate अच्छा https://github.com/jumpsuit/jumpstate लग रहा है। – imns
यह दृष्टिकोण क्रॉस-घटक संचार के मुद्दे को हल करेगा, लेकिन आपको अभी भी 'राज्य' में स्थानीय रूप से प्रत्येक घटक डेटा को प्रबंधित करने की आवश्यकता होगी। कार्यों और reducers के अलावा, redux भी मदद करता है, तो आपको स्थानीय राज्य के बारे में सोचना नहीं है, और इसे (शायद कई) घटकों के बीच सिंक में कैसे रखना है। –