如何连接来自不同文件的事件？ Javascript /骨干

Question

我想用一个文件的.on方法来侦听另一个文件，如果发生更改，我希望它触发一个新视图的渲染。这是我的尝试，甚至将某些东西打印到控制台，它不起作用。

这是我的路由器文件：

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'views/page', 
    'models/search', 
    'views/search', 
    'text!templates/search.html' 
], function($, _, Backbone, PageV, SearchM, SearchV, SearchT) { 
    var vent = _.extend({}, Backbone.Events); 
    var AppRouter = Backbone.Router.extend ({ 
     routes: { 
      'page/:id': 'showPage', 
      's': 'showView' 
     } 
    }); 
    var initialize = function() { 
     var app_router 
     app_router = new AppRouter; 
     app_router.on('route:showPage', function (id) { 
      var page = new PageV(); 
      page.render(id); 
     }); 

     **app_router.on('route:showView', function() { 
      var searchM = new SearchM({vent: vent}); 
      var search = new SearchV({model: searchM, vent: vent}); // 
      $('#Sirius').html(SearchT); 
      search.render();  
       vent.on('nextPage', this.printCons); 
       function printCons() { 
      console.log('printing from listening') 
      };** 


     }); 


     Backbone.history.start(); 
    }; 
    return { 
     initialize: initialize 
    }; 
}); 

这是搜索视图文件，所呈现的，但不是要求在路由器中的console.log功能（即群星环绕）

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'models/search', 
    'text!templates/search.html', 

], function($, _, Backbone, SearchM, SearchT){ 
    var vent = _.extend({}, Backbone.Events); 
    var Search = Backbone.View.extend({ 
    el: $("#Sirius"), 

    events: { 
     'submit #searchMusic': 'search' 
    }, 

    search: function (e) { 
     console.log('searching...'); 
     e.preventDefault(); 
     var _this, that; 
     _this = this; 
     that = this.model; 
     //post instance to the server with the following input fields 
     this.model.save({ 
     channel: $('#channel').val(), 
     week: $('#week').val(), 
     year: $('#year').val(), 
     filter: $('#filter').val() 
     },{success: storeMusic }); 

     function storeMusic (that, response, options) { 
     console.log('store'); 
     //create new instance of the localStorage with the key name 
     _this.model.localStorage = new Backbone.LocalStorage("music"); 

     _this.clearLocalStorage(_this); 

     _this.saveToLocalStorage(response, _this); 
     }; 

    }, 

     clearLocalStorage: function (_this) { 
     console.log('clear'); 
      //removes the items of the localStorage 
      _this.model.localStorage._clear(); 

      //pops out the first key in the records 
      _this.model.localStorage.records.shift(); 

     }, 
     saveToLocalStorage: function (response, _this) { 
      console.log('save'); 
     _this.model.save({music: response}, {success: _this.nextPage}); 
     }, 


     nextPage: function (_this, response, options) { 
      console.log('entered next page'); 
      vent.trigger('nextPage', this.model) 

     } 
    }); 
    return Search; 
}); 

该功能正在被调用，一切工作正常，我正在努力让事件在路由器端听到，所以我可以让用户导航到另一个页面后点击提交按钮，并返回的响应成功存储本地存储。 nextPage函数确实被调用，但我认为我没有正确实现vent.trigger或.on ...我在路由器和视图中都调用它（var vent = ...）

Answer 1

var vent = _.extend({}, Backbone.Events); 

通风孔在两个js文件中都被初始化，这两个文件创建了两个不连接的对象。要在搜索视图文件中解决此问题，请删除发布宣告在接下来的页面功能变化

vent.trigger('nextPage', this.model) 

到

var vent = this.model.get('vent'); 
vent.trigger('nextPage', this.model)