在Backbone.js视图中多次引用div

时间:2012-11-26 23:46:52

标签: javascript backbone.js refactoring

想知道处理这个问题的最佳方法是什么。假设我有一个div,我在一个Backbone视图中的多个方法中引用,我不想每次都要继续重新查询它。

e.g。

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());
    }
});

引用它的首选方法是将它声明为对象吗?还是有一些我不了解的更好的模式?

e.g。

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());
    }
});

1 个答案:

答案 0 :(得分:2)

如果这是特定情况,您可以在调用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());
    }
});