初始化后添加backbone.js事件

时间:2012-04-17 01:46:48

标签: javascript backbone.js

此代码没有太多上下文,但会说明我的问题。它是在AMD模块中定义的Backbone视图,我用它来通过require.js加载

基本上我希望能够在运行初始化后将事件添加到Backbone视图。目前我正在创建一个空事件对象,然后在一个名为addView的方法中,每次调用该函数时都会添加一个事件。这目前无效。

我不确定事件在什么时候被注册,但是我怀疑在events对象发生变化时我不得不让视图更新它的监听器?

有没有人知道如何在初始化后向Backbone.js添加事件?

   define([
    'jQuery',
    'Backbone'],

    function ($, Backbone) {

        var contentViews = new Array();

        var SlidePanelView = Backbone.View.extend({

            events: {},

            /// <param name="targetDataAtt">The unique value inside the target's Data-Slide-Panel-Id attribute</param>  
            /// <param name="event">Backbone event to trigger view</param>
            /// <param name="destroyOnRemove">True to destroy view when removed, False otherwise (Default true)</param>  
            addView: function (targetDataAtt, event, view, destroyOnRemove) {
                destroyOnRemove = typeof destroyOnRemove !== 'undefined' ? destroyOnRemove : true;

                this.events[event] = "viewEventFired";
                contentViews[targetDataAtt] = { View: view, DestroyOnRemove: destroyOnRemove };
            },

            viewEventFired: function (e) {

                var target = $(e.target);
                var id = target.attr('data-slide-panel-id');
                console.log(id);
            }

        });

        // Return a singleton??
        return new SlidePanelView;


    });

1 个答案:

答案 0 :(得分:11)

如果我正确理解了这个问题,在向事件哈希中添加其他事件后,请在视图上调用delegateEvents()以重新绑定事件。

    addView: function (targetDataAtt, event, view, destroyOnRemove) {
       destroyOnRemove = typeof destroyOnRemove !== 'undefined' ? destroyOnRemove : true;
       this.events[event] = "viewEventFired";
       this.delegateEvents();
       contentViews[targetDataAtt] = { View: view, DestroyOnRemove: destroyOnRemove };
    }

它取消绑定所有现有的事件绑定并重新绑定事件哈希中的所有事件,我不确定这样做的潜在性能问题,但需要注意的事项。