Question

我想知道处理以下情况的最佳方法是什么。想象一下，我们有一组记录，每个记录都附加到一个视图。每个视图都有一个运行特定功能的按钮。为了论证，页面上一次最多可以有一百个这样的视图。这种观点的一个例子如下：

var RecordView = Backbone.View.extend({
    events: {
        'click .js-cta': 'onCTAClick'
    },
    onCTAClick: function(event) {
        // Do something.
    }
});

这显然会绑定100个DOM侦听器并占用比我们想要的更多的内存。处理此问题的一种方法是为集合创建一个View，并在该级别放置一个委托的侦听器，这将决定应该通知哪个视图，然后触发一个事件，如下所示：

var CollectionView = Backbone.View.Extend({
    events: {
        'click .js-cta': 'onCTAClick'
    },
    onCTAClick: function(event) {
        // Use event data to determine appropriate child view to notify.
        // Notify the child view by triggering an event on it (childView.trigger('CTAClick')).
    }
});

var RecordView = Backbone.View.Extend({
    initialise: function() {
        this.on('CTAClick', this.onCTAClick);
    },
    onCTAClick: function(event) {
        // Use event data to determine appropriate child view to notify.
        // Notify the child view by triggering an event on it (childView.trigger('')).
    }
});

我想知道这是否比100+ DOM监听器方法更好......你只有一个DOM监听器，但是RecordView中有100个监听器等待事件通知。 DOM事件监听器是否比Backbone事件监听器“更重”？您可以完全删除侦听器并让CollectionView直接触发一个方法，将侦听器减少到一个方法，但这会紧密耦合视图。如果这两个视图在功能上如此接近并且几乎交织在一起，这种紧耦合是否很重要？

接近这种情况的正确方法是什么？

Answer 1

IMOH我认为没有正确的方法。你概述了两种方法的工作。但是，在处理大量视图时，从内存角度来看，利用DOM冒泡的委托方法将是最佳的。在这种方法中，我可能倾向于将记录视图中的记录视图的id存储为数据属性，并在集合视图中存储该id的视图映射。然后直接调用该方法。不用担心它紧密耦合。

Backbone：处理大量视图侦听器的最佳方法？

1 个答案: