Backbone.js: communication entre les vues

Question

Je suis en train de travailler sur une Dorsale application qui contient une liste d'entrées, à l'instar de l'exemple d'application Todos (http://documentcloud.github.com/backbone/examples/todos/index.html).

Donc, j'ai une vue d'Application et une vue par élément de la liste. Maintenant, dire que j'ai un mondial bouton modifier. La vue d'Application serait en mesure de gérer un clic et ce que je veux faire est d'indiquer à chaque affichage de la liste pour afficher un bouton supprimer.

Dans les captures d'écran ci-dessous (à partir de Spotify), en appuyant sur le bouton Modifier les causes de toutes les vues de liste pour modifier l'apparence.

Quelle est la meilleure façon de le faire avec de la colonne vertébrale. J'ai besoin de parcourir toutes les vues de liste et appeler un editMode fonction. Mais la vue d'Application (de la boîte) ne savent pas à propos de la liste de points de vue..

Answer 1

J'ai écrit un article d'un moment de retour sur quelques options différentes pour la coordination entre les points de vue: http://lostechies.com/derickbailey/2011/07/19/references-routing-and-the-event-aggregator-coordinating-views-in-backbone-js/

dans votre cas, je vous recommande d'utiliser l'agrégateur d'événements que je décris dans cet article. vous pourriez avoir chaque point de vue à écouter un "edit mode" de l'événement, ou quelque chose de similaire. lorsque cet événement se déclenche, chaque point de vue, à l'écoute car il permettrait de mettre à jour lui-même pour aller dans le mode d'édition. ensuite, vous devez faire face lorsque vous cliquez sur "done" envoyer "viewmode de l'événement", ou quelque chose de similaire, et ont chaque vue de mettre à jour lui-même de manière appropriée.

Answer 2

Mes deux centimes: Il y a un simple "hack" que vous pouvez faire avec backbone.js pour vraiment avoir une pub/sub qui peuvent communiquer entre les points de vue:

Quelque chose le long de ces lignes (non testé):

var EventBus = Backbone.Model.extend({

   publish: function(event, args){

       this.trigger(event, args);

   },

   subscribe: function(event, args) {

       this.bind(event, args);

   }
});

Fondamentalement, vous obtenez l'idée. Maintenant, pour chaque vue, il faut la "liaison" de cette EventBus (depuis les vues ne peuvent se lier à des modèles et des collections de la colonne vertébrale) - en gros, vous avez juste à utiliser la méthode des noms de publier/souscrire pour être en phase avec la nomenclature d'un tel modèle, mais vous pouvez choisir de ne pas. Il suffit de créer un vide EventBus "classe" dans ce cas et ont toutes vue de se lier à elle :)

Ainsi, chaque vue ne doit être couplé à ce EventBus et d'agir sur les événements reçus! Backbone.js l'interne s'occupe de toute la plomberie de ce modèle de conception, de sorte que vous avez à peu près l'obtenir gratuitement :)

Le code ci-dessus peut ne pas s'exécuter en tant que-est, mais il est là pour vous donner une idée sur le sujet...