javascript - 在 Backbone.js View 中多次引用 div

Question

想知道处理这个问题的最佳方法是什么。假设我有一个 div，我在 Backbone View 之一的多个方法中引用它，并且我不想每次都重新查询它。

例如

Backbone.View.extend({
    showReviewOverlay : function(evt) {
        var $overlay = $('#js-add-review-overlay');
        $(evt.currentTarget).prepend($overlay.show());
    }
    hideReviewOverlay : function(evt) {
        var $overlay = $('#js-add-review-overlay');
        $(evt.currentTarget).closest($overlay.hide());
    }
});

引用它的首选方法是将其声明为对象吗？还是有一些我不知道的更好的模式？

例如

Backbone.View.extend({
    overlay : { 'container' : $('#js-add-review-overlay') },

    showReviewOverlay : function(evt) {
        $(evt.currentTarget).prepend(this.container.overlay.show());
    }
    hideReviewOverlay : function(evt) {
        $(evt.currentTarget).closest(this.container.overlay.hide());
    }
});

Answer 1

如果这是特定情况，您可能会在调用 render 时获取对该元素的引用:

Backbone.View.extend({
    render: function () {
        // do rendering stuff
        this.$overlay = this.$('#js-add-review-overlay');
    },
    showReviewOverlay : function(evt) {
        $(evt.currentTarget).prepend(this.$overlay.show());
    }
});