6

所以我有一个看起来像这样的视图。

    //base class
    var SelectListView = Backbone.View.extend({
        initialize: function() {
            _.bindAll(this, 'addOne', 'addAll');
            this.collection.bind('reset', this.addAll);
        },
        addAll: function() {
            this.collection.each(this.addOne);
        },
        events: {
            "change": "changedSelected"
        },
        changedSelected: function() {
            this.selected = $(this.el);
            this.setSelectedId($(this.el).val());
        }

    });

    //my extended view
    var PricingSelectListView = SelectListView.extend({
        addOne: function(item) {
            $(this.el).append(new PricingView({ model: item }).render().el);
        }         
    });

我已经实例化了这样的视图......

var products = new ProductPricings();
var pricingsView = new PricingSelectListView({
     el: $("#sel-product"),
     collection: products
});

在其他地方（另一种视图自定义方法）我已经更新了定价视图的集合

pricingsView.collection = new ProductPricings(filtered);

这没有看到做任何事情。

pricingsView.render();

所以现在集合中的项目更少了，但新视图永远不会在 DOM 中呈现或刷新。

我该怎么做 1.) 刷新 DOM 中的渲染？2.) 让它自动刷新DOM？我是否必须以某种方式告诉它在集合更改时进行渲染？

4

2 回答 2

4

你绑定addOne()到一个reset事件。当您只是替换pricingsView.collection实例时，该事件不会被触发并且addOne()不会被执行。

请尝试：

pricingsView.collection.reset(filtered);
于 2012-01-05T14:13:33.567 回答
3

这可能有效，因为您已经绑定到集合的重置事件：

pricingsView.collection.reset(filtered);

http://backbonejs.org/#Collection-reset

当重置发生时，您仍然需要调整渲染逻辑以从视图中删除旧标记。

于 2012-01-05T14:13:19.103 回答