javascript - Backbone : Detect the moment after a view is removed -
what best way detect moment after backbone view, extended other object or not, has been removed?
jsfiddle added : http://jsfiddle.net/simmoniz/m5j8q/1917/ how make line #32 working without altering views...
<h2>the container</h2> <div id="container"></div> <script> var someextendedview = marionette.itemview.extend({ events: { 'click button.remove':'remove', }, }); var johnview = someextendedview.extend({ template: _.template('<div><p>i\'m <em>john view</em> <button class="remove">remove me</button></p></div>'), }); var doeview = someextendedview.extend({ template: _.template('<div><p>i\'m <strong>doe view</strong> <button class="remove">remove me</button>'), }); var simpleview = backbone.view.extend({ initialize: function(){ backbone.view.prototype.initialize.apply(this, arguments); this.$el.bind('click', _.bind(this.remove, this)); }, render: function(){ this.$el.html('<div><p>simple view. <strong>click on me remove</strong></p></div>'); return this; } }); var container = { el: $('#container'), views: null, add: function(view){ if(!this.views)this.views = []; this.el.append(view.render().el); view.$el.bind('remove', _.bind(this.onremove, this)); }, onremove : function(element){ console.log('element ' + element + ' has been removed!'); } } container.add(new johnview()); container.add(new doeview()); container.add(new simpleview()); </script>
view lifecycle management 1 of important things missing backbone core.
all non-trivial apps end needing solve this. can either roll own, or use marionette or chaplin.
basically, backbone doesn't have concept of view destruction or dealocation. point in time in listeners should unbound. single greatest source of memory leaks in backbone apps.
Comments
Post a Comment