यह रेंडर फ़ंक्शन क्यों काम नहीं करता है?

Question

मैं रीढ़ की हड्डी के साथ खेल रहा हूं और इसे सीखने की कोशिश कर रहा हूं। मैं थोड़ी देर के लिए इस बिंदु पर अटक गया हूँ। निम्नलिखित कोड के साथ क्या गलत है यह पता लगाने में सक्षम नहीं है?

render: function() { 
    this.$el.empty(); 
    // render each subview, appending to our root element 
    _.each(this._views, function(sub_view) { 
     this.$el.append(sub_view.render().el); // Error on this line 
    }); 

Answer 1

आपके पास संदर्भ समस्या है। this आप रेफर कर रहे हैं जिसमें $el शामिल नहीं है जिसे आप ढूंढ रहे हैं। आप इसे self वेरिएबल घोषित करके ठीक कर सकते हैं जो उचित this पर इंगित करता है। निम्नलिखित कोड आपके लिए काम करना चाहिए।

render: function() { 
    var self = this; //Added this line to declare variable (self) that point to 'this' 
    this.$el.empty(); 
    _.each(this._views, function(sub_view) { 
     self.$el.append(sub_view.render().el); //Used 'self' here instead 'this' 
}); 

साइड नोट: यदि आप रीढ़ झुकाव रहे हैं के रूप में भी आप दस्तावेज़ पुनर्प्रवाहित के साथ एक बहुत commong जावास्क्रिप्ट समस्या के बारे में पता होना चाहिए। आप संग्रह में प्रत्येक मॉडल के लिए एक दृश्य प्रस्तुत कर रहे हैं। यह प्रदर्शन मुद्दों और विशेष रूप से पुराने कंप्यूटर और मोबाइल उपकरणों पर जा सकता है। आप container में सबकुछ प्रस्तुत करके और प्रत्येक बार डोम को अपडेट करने के बजाय इसे एक बार जोड़कर अपने कोड को अनुकूलित कर सकते हैं। यहां एक उदाहरण दिया गया है:

render: function() { 
    this.$el.empty(); 
    var container = document.createDocumentFragment(); 
    _.each(this._views, function(sub_view) { 
    container.appendChild(sub_view.render().el) 
    }); 
    this.$el.append(container); 
}