4

バックボーンで PubSub タイプの機能を実装するより良い方法を探しています。私は現在これを達成していますが、それを行うためのより良い方法を探しています。

サンプル ルーティング コード

var AppRouter = Backbone.Router.extend({
   customEvents: _.extend({}, Backbone.Events),

   routes: {
     "login": "login"
   },

   //Injecting custom event
   login: function(){
       this.before(function () {
           app.showView('#Content', new LoginView({customEvents:this.customEvents}), "login", true);

     }); 
   },

    //Injecting custom event
   otherView: function(){
       this.before(function () {
           app.showView('#Header', new OtherView({customEvents:this.customEvents}), "login", true);

     }); 
   },

    ..... more code

});

サンプル ビュー コード。bind を使用して customEvent をリッスンしていることに注意してください。これはうまくいきますが、別の方法を探しています

LoginView = Backbone.View.extend({
   initialize: function(options){
      this.customEvents = options.customEvents;
      this.customEvents.bind('app:loggedin', this.loggedIn);

   },

   loggedIn: function(){
       console.log("LOG CHANGED");
   },

 ...more code

ビューで使用している残りのイベントと一緒にイベントを保持したいと思います。これを達成する方法がわからない。View クラスを拡張する必要がありますか?

ビューでやりたいこと

  LoginView = Backbone.View.extend({
    events: {
         "app:loggin" : "loggedIn"
     },

     loggedIn: function(){
       console.log("LOG CHANGED");
    },

 ...more code
4

1 に答える 1

0

要旨 : https://gist.github.com/vermilion1/5600032

デモ: http://jsfiddle.net/vpetrychuk/3NVG9/1

コードのプレビュー:

// -- BASE VIEW ------------------

var BaseView = Backbone.View.extend({
    constructor : function (options) {
        Backbone.View.prototype.constructor.apply(this, arguments);
        this._eventAggregator = options && options.eventAggregator || this;
        this._parseTriggers();
    },
    _parseTriggers :  function () {
        _.each(this.triggers || {}, function (fn, event) {
            var handler = this[fn];
            if (_.isFunction(handler)) {
                this.listenTo(this._eventAggregator, event, handler);
            }
        },
        this);
    }
});

// -- TEST ------------------

var View = BaseView.extend({
    triggers : {
        'hello' : 'helloHandler',
        'bye' : 'byeHandler'
    },
    helloHandler :  function (name) {
        console.log('hello, ' + name);
    },
    byeHandler :  function (name) {
        console.log('bye, ' + name);
    }
});

var view1 = new View();
view1.trigger('hello', 'dude 1'); // -> hello, dude 1
view1.trigger('bye', 'dude 1'); // -> bye, dude 1 

var vent = _.extend({}, Backbone.Events);
var view2 = new View({eventAggregator:vent});
vent.trigger('hello', 'dude 2'); // -> hello, dude 2
vent.trigger('bye', 'dude 2'); // -> bye, dude 2
于 2013-05-17T15:56:23.020 に答える