Épine dorsale de la vue de l'élément DOM supprimé

Je lis à propos de la Backbone.js zombie (ou de fuite de mémoire) problème. Fondamentalement, vous devez vous séparer et retirer l'élément du DOM lorsque vous n'en avez plus besoin pour s'assurer que tous les événements sont supprimés.

Maintenant, j'ai une page unique application avec un peu de conteneurs:

<div id="page1"></div>
<div id="page2"></div>

et d'ajouter ma underscore.js les modèles de ces espaces réservés. J'ai un modèle par page comme:

HomeView = Backbone.View.extend({
  el: '#page1'
)}

Maintenant, lorsque je clique sur un élément sur la page, je navigue à l'autre Backbone.js vue:

clicked: function(ev){
  $(this.el).remove(); //<-- this is the problem
  $(this.el).unbind();
  App.navigate('page/2', true);
}

Cela fonctionne bien mais... j'ai enlevé le page1 élément du DOM, donc quand j'utilise le bouton retour pour revenir à la page précédente mon élément est allé et il n'y a rien pour fixer le HTML.

Je n'ai probablement pas à comprendre comment faire un lien Backbone.js vues avec le DOM... dois-je conserver l'élément avec le risque de fuites de mémoire?

Merci!

> - je garder la lecture sur la Backbone.js zombie (ou de fuite de mémoire) problème a un lien ou un article?
Ici, vous allez: lostechies.com/derickbailey/2011/09/15/...
bien derick ne vous fournir une solution n'est-il pas? un gestionnaire de vues ou comment vous pourriez l'appeler.

OriginalL'auteur Cimm | 2011-12-12

5

Comme le dit l'article, (oui, j'ai essayé sa méthode avant dans mes propres projets), vous devez trouver un moyen de supprimer votre point de vue de l'élément du DOM et à délier les événements.
Toutefois, il existe 2 types d'événements, 1) épine Dorsale des événements, 2) les événements qui sont liés à votre éléments du DOM avec jQuery.

Ainsi, au lieu de votre:
```
$(this.el).remove();
$(this.el).unbind();
```
Ce faire:
```
this.remove();
this.unbind();
```
Vous êtes maintenant en supprimant épine Dorsale des événements; et la this.remove sur une vue appellera $(this.el).remove();.

Cependant, c'est seulement la façon de supprimer un point de vue et de ne pas laisser les zombies. Vous devriez examiner ses méthodes pour montrer une vue de rendre ce processus plus automatique.
C'est dans son article.

Grâce Sander. N'était pas sûr de la "view manager" comme je ne savais pas que la solution ailleurs et pensé qu'il y avait peut-être un moyen intégré pour prendre soin de ce problème.
il n'y a pas de construire de façon, parce que si ils ont construit dans cette limiter à de nombreux utilisateurs sur la façon de créer des applications, de la colonne vertébrale donne simplement de la structure à vos applications, à vous de choisir quoi et comment vous voulez le mettre en place, que la liberté est la clé! 🙂 donc pour l'instant il n'y a pas construit dans le gestionnaire de vues, tandis que derick l'idée n'est pas la seule idée, et probablement pas le saint graal, c'est un grand bond en avant 🙂

OriginalL'auteur Sander
10

En ce qui concerne à la perte de la page1 élément dans votre page, et ainsi ne pas être en mesure de remplir l'élément avec le HTML, je n'ai la suite.

Au lieu d'utiliser:
```
this.remove();
```
... qui supprime l'élément tout à fait, et essayer de comprendre comment le rajouter, j'utilise jQuery:
```
$(this).empty;
```
Ce vide tous les éléments d'enfant, de texte et de données et les gestionnaires d'événements. Plus d'infos sur: http://api.jquery.com/empty/

En fait, je l'utilise tous les suivants, qui peut-être exagéré, mais nous allons voir:
```
this.undelegateEvents();
$(this).empty;
this.unbind();
```
Espère que c'est utile!

OriginalL'auteur Alejandro Rubio
1

Épine dorsale de la version de développement(master) présente désormais _removeElement()
```
 remove: function() {
      this._removeElement();
      this.stopListening();
      return this;
    },
```
Supprimer ce point de vue de l'élément à partir du document et de tous les écouteurs d'événement attaché à elle. Exposés pour les sous-classes à l'aide d'une alternative de manipulation du DOM API.
```
_removeElement: function() {
      this.$el.remove();
    },
```
http://backbonejs.org/docs/backbone.html

OriginalL'auteur d0001

Vous devez vous connecter pour publier un commentaire.