2

在我的路由器中，我需要这样的视图：

require(['views/business-detail-view'],
    function(BusinessDetailView) {
        var businessDetailView = new BusinessDetailView({collection:                        businessOverviewCollection.models[id], id: id});
        businessDetailView.render();
    }
);

在视图中，我正在绑定这样的事件：

events: {
        'click #about-btn'   : 'aboutHandler',
        'click #contact-btn' : 'contactHandler',
        'click #deals-btn'   : 'dealsHandler',
        'click #map-btn'     : 'mapHandler'
},

现在的问题是，如果第一次渲染视图，则调用回调。但是，如果视图需要在其他地方再次呈现，则回调会被调用两次，依此类推。

我怎样才能防止这种情况，或者我做错了什么？

更新：

与此同时，我已将路由器中的代码更改为：

if ( !businessDetailView ) {
    require(['views/business-detail-view'],
        function(BusinessDetailView) {
            businessDetailView = new BusinessDetailView({collection: businessOverviewCollection.models[id]});
            businessDetailView.render(); 
        }
    );
}
else {
    businessDetailView.collection = businessOverviewCollection.models[id];
    businessDetailView.render(); 
}

这似乎解决了这个问题，但我仍然是新手，知道这是否是一个有效的模式。

4

1 回答 1

0

在您的观点中，您可能会清除页面上现有的 HTML 并将其替换为新的 HTML。当您清除旧的 HTML 时，您还应该清除旧的事件处理程序，这样它们就不会被闲置。例如，在您想要呈现 newHtml 时，您可以执行以下操作：

@$el.off().html(newHtml)
于 2012-08-22T21:41:35.727 回答