Backbone - verhindert verzögerte Ausführung nach Ansicht entfernt wird

Question

ich eine Hauptansicht, die einen Kasten hat, die Subviews hat, die Sie zwischen

Nach einem Abruf Ajax-Aufruf erfolgreich ist, ein ‚Erfolg‘ div auf der Hauptansicht wechseln wird gezeigt.

Das Problem, mit dem ich konfrontiert bin, ist, dass, wenn ich zwischen Subviews wechsle, die verzögerte Zusage aus dem Abruf der vorherigen Ansicht ausgeführt wird und das 'Erfolg' div.

dies ist mein Code:

this.model.fetch().done(function() { 
    $('#success').show(); 
}); 

onChangeSubview: function() { 
    this.subview.unbind(); 
    this.subview.remove(); 
} 

Diese Frage SO abort-ajax-requests-using-jquery sagt, dass Sie den Zeiger speichern, um die es verschoben und stoppen, indem wie so abbrechen() aufgerufen:

var fetchXhr = this.model.fetch().done(function() { 
    $('#success').show(); 
}); 
onChangeSubview: function() { 
    fetchXhr.abort(); 
} 

Ich habe mehr Fetches für jede Teilansicht und einige werden in einem Intervall wiederholt, das würde bedeuten, dass ich jede Abrufanforderung speichern und durch sie durchlaufen müsste, die jeweils abbrechen.

Gibt es eine bessere Möglichkeit, die Ausführung der zurückgestellten Funktion zu stoppen? zB: eine Art von Prüfung, um zu sehen, ob die Unteransicht entfernt wurde, oder eine Funktion, um alle verzögerten Versprechungen zu lösen?

Answer 1

Das Abbrechen ist nicht unbedingt wünschenswert, da Sie möchten, dass die Ansichten auch dann weiterhin aktualisiert werden, wenn sie ausgeblendet sind (dies wird dadurch bestätigt, dass Sie gerade die Verbindung trennen/entfernen).

Sie können natürlich auch die Notwendigkeit, durch die Annahme eines Musters zum Abbruch vermeiden, die die ‚#success‘ Element verursacht mit einem Verfahren durch Rigging ein $('#success') Objekt gezeigt bedingt, zB werden, die eine Funktion gibt, die das #success Element zeigt nur, wenn ein Eine bestimmte Unteransicht (oder ihr Container) ist sichtbar (oder welches Kriterium auch immer passt).

// in some suitable outer context 
var $success = $('#success'); 
$success.showConditional = function($container) { 
    var $self = $(this); 
    return function() { 
     if($container.is(':visible')) { 
      $self.show(); 
     } 
    } 
}; 

... 

$subviewContainer = $("someSelector"); //or maybe the container is already a property of this or this.model? 
this.model.fetch().done($success.showConditional($subviewContainer)); 

Mit diesem Muster an Ort und Stelle für alle Abholungen, wird das #success Element zeigt nicht versteckt oder entfernt Subviews.

Das ist das Prinzip sowieso. Möglicherweise müssen Sie das Detail an Ihr Gesamtmuster anpassen.

Answer 2

Eine Möglichkeit, dies zu lösen, wäre, alle Ihre Abrufe für eine Unteransicht zu einer Liste hinzuzufügen und dann onChangeSubview über sie zu iterieren und den Abbruch z.

this.fetches.forEach(function(fetchXhr) { 
    fetchXhr.abort(); 
}); 

oder wenn Sie wollen es die Unders Art und Weise tun

_.invoke(this.fetches, 'abort'); 

Sie könnten möglicherweise sogar diese Funktionalität in einer Basisansicht setzen, die Sie so erweitern Sie konnten weg einige davon abstrakt.