Backbone.js - सभी उप विचारों

Question

मैं एक शीर्ष स्तर पृष्ठ दृश्य कि खुद को फिर से प्रस्तुत करना जब भी मार्ग परिवर्तन निकालें। मेरे पास इस पृष्ठ दृश्य में एम्बेडेड कई घोंसले वाले उप-दृश्य हैं। अगर मैं पृष्ठ दृश्य फिर से प्रस्तुत करने के लिए किया गया था,/पृष्ठ दृश्य के साथ-साथ सभी नेस्टेड सब-विचारों निकल रहा हटाने की जरूरत है या मैं केवल हटाने/पृष्ठ दृश्य निकल की जरूरत है? अगर मुझे सभी उप-विचारों को हटाने/अनइंड करने की आवश्यकता है, तो ऐसा करने का सबसे अच्छा तरीका क्या है?

Answer 1

हाँ, आप ठीक ढंग से निकालने और उन्हें निकल की जरूरत है:

http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

यह करने के लिए आसान तरीका माता पिता दृश्य में अपने उप-विचारों की एक सरणी स्टोर करने के लिए है।

ParentView = Backbone.View.extend({ 
    initialize: function(){ 
    this.childViews = []; 
    }, 

    render: { 
    for (var i = 0; i < 10; i++){ 
     var childView = new ChildView(); 
     // do stuff with the child view 
     this.childViews.push(childView); 
    } 
    }, 

    close: function(){ 
    this.remove(); 
    this.unbind(); 
    // handle other unbinding needs, here 
    _.each(this.childViews, function(childView){ 
     if (childView.close){ 
     childView.close(); 
     } 
    }) 
    } 
}); 

जनक दृश्य पर close विधि कॉल करने के लिए जब आप तैयार हैं यह होने के लिए सुनिश्चित करें: तो फिर माता-पिता देखने के लिए, सरणी के माध्यम से लूप पर एक close विधि में और बच्चे दृश्यों पर एक close विधि कॉल हटा दिया/बदला गया। यह सुनिश्चित करेगा कि सभी बच्चे ठीक से साफ हो जाएं (मान लें कि उनमें से सभी का अपना close विधि है)।

Answer 2

इसके बजाय बच्चों की एक सरणी रखने देखने के लिए, अपने दृश्य के सभी गुण के माध्यम से पुनरावृति और देखो कि कौन सा Backbone.View का एक उदाहरण हैं सकता है की

; आपको अपने मूल दृश्य में प्रत्येक बच्चे के दृश्य के लिए एक संपत्ति सेट करना सुनिश्चित करना होगा।

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

उदाहरण:

var ContextView = Backbone.View.extend({ 
    initialize: function() { 
     // views render themselves via their initialize methods 
     this.titlebar = new TitlebarView({el: $("#titlebar")});  
     this.toolbar = new ToolbarView({el: $("#toolbar")}); 
     this.content = new ContentView({el: $("#content")}); 
    }, 
    removeChildViews: function() {  
     for(var prop in this){ 
      if (this[prop] instanceof Backbone.View) { 
       console.log("This is a view: "+ prop + ' in ' + this[prop]);  
      } 
     } 
    }, 
    render: function() { 
     this.$el.html(this.el); 
    } 
    }); 

Answer 3

एक सरल और मॉड्यूलर वर्ग जो आपके लिए उपयोगी हो सकता है।

ContainerView = Backbone.View.extend({ 
    initialize: function() { 
    this.children = []; 
    }, 
    remove: function() { 
    Backbone.View.prototype.remove.apply(this, arguments); 
    this.removeAllChildren(); 
    }, 
    removeAllChildren: function() { 
    _.each(this.children, function(view) { view.remove(); }); 
    this.children = []; 
    }, 
    appendAllChildren: function() { 
    _.each(this.children, function(view) { this.$el.append(view.render().$el); }, this); 
    } 
}); 

उपयोग:

MyView = ContainerView.extend({ 
    render: function() { 
    this.removeAllChildren(); 
    this.$el.empty(); 

    // For each child view... 
    // this.children.push(new SomeControl(...)); 

    this.appendAllChildren(); 
    return this; 
    } 
}); 

Answer 4

थोड़ा Zengineer की तरह लिखा है, मैं, विश्व स्तर पर निम्नलिखित की तरह Backbone.View.remove पैच करने के लिए चाहते हैं, जिससे कि किसी भी बच्चे को देखा गया इस पर संलग्न निकाल दिए जाते हैं

var originalRemove = Backbone.View.prototype.remove; 

Backbone.View.prototype.remove = function() 
{ 

    for (var view in this){ 
    if (this[view] instanceof Backbone.View && this[view] != this) { 
     this[view].remove(); 
    } 
    } 


    originalRemove.apply(this, arguments); 

}