Question

我使用Backbone + requirejs构建我的应用程序，在下面的模块中初始化函数用于从另外两个模块“HomeView，InnerView”加载初始化函数，在这个模块中我想听Backbone.history事件。但该模块没有听取此类事件。

路由器

// Filename: router.js
define([
'jquery',
'underscore',
'backbone',
'app/config',
'app/views/homeview',
'app/views/inner_view'
], function($, _, Backbone, Config, HomeView, InnerView) {

var AppRouter = Backbone.Router.extend({

    initialize: function() {

    },
    routes: {
        // Define some URL routes
        '': 'defaultRoute',
        '!/home': 'defaultRoute',
        '!/activities': 'activities',
        '!/activities/:id': 'activity',
        '!/vacancies': 'vacancies',
        '!/vacancies/:id': 'vacancies',
        // 404, not found
        '*actions': '404'
    },
    defaultRoute: function() {

        //if this route is served from inner pages, we have to trigger "close:Inner"
        Backbone.trigger('close:Inner'); 
        Backbone.current = 'Home';

    },
    activities: function(){

        Backbone.trigger('view:Activities');
        Backbone.trigger('close:'+Backbone.current);            
        Backbone.current = 'Activities';            

    },
    activity: function(id){

        Backbone.trigger('close:' + Backbone.current);
        Backbone.current = 'Activity';   

    },
    vacancies: function(){

    },     
    404: function(actions) {

        // We have no matching route, lets display 404
        $('.content_wapper').html(actions + " no such page on the system");

    }

});

var initialize = function() {

    HomeView.initialize();
    InnerView.initialize();                

    Backbone.appRouter = new AppRouter();
    Backbone.history.start();

};

return {
    initialize: initialize
};
});

阻止我在另一个视图中收听backbone.history事件有什么不对？

Innerview模块

 // Filename: views/boilerplate.js
define([
'jquery',
'underscore',
'backbone',
'app/config',
'text!templates/inner_header.html',
'bootbox',
'text!templates/breadcrumb.html',
'purl'
], function($, _, Backbone, Config, inner_header_template, bootbox, breadcrumbTemplate) {

var url = $.url(),
    InnerView = Backbone.View.extend({

    el: $(".header_content"),
    template: _.template(inner_header_template),
    initialize: function(options) {

        Backbone.history.on('route:activities', this.activities);           

    },
    render: function() {},
    activities: function() {
        alert('activities');
    },
    events: {},
    close: function() {

        $('.top_menu').remove();
        $('.main_menu_inner').remove();
        $('.content_container').empty();
        $(this.el).unbind();
        delete this.$el; //delete the jQuery wrapped object variable
        delete this.el; //delete the variable reference to this node

    }

});

var initialize = function() {

    new InnerView();

};

return {
    initialize: initialize
};


});

Answer 1

你正在Backbone对象上触发事件而不是Backbone.history，试试这个：

Backbone.history.trigger('close:Inner');

你必须在路由器上监听，而不是在Backbone.history上。说明这一点的Here is an example。

Backbone收听Backbone.history事件

1 个答案: