我正在尝试对一个文件使用 .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 = ...）