javascript - 如何使用主干布局管理器在主干中异步获取数据？

Question

我在布局管理器中遇到问题，无法让 View 等待渲染，直到一堆 AJAX 调用完成并成功填充我传递给 subview 的集合。

这是我的初始化函数:

initialize : function(){
            var collection;

            collection = new BobLawBlaw.Collection();
            collection.fetch();

            this.collection = collection;
        }

我的获取有点复杂:

fetch : function(){
            var that = this;

            return $.when.apply(null, TL.reporting.getData.call(this, 125)).done(function(xhr1, xhr2){
                var data1 = xhr1[0].data, data2 = xhr2[0].data, dates = data1.date,

                // do a bunch of stuff with the data i get above to construct the models how i need
                models = [
                   // bunch of objects using the data
                ];

                that.add(models);
            });
        }

getData 函数从两个 ajax 调用中收集延迟并将它们返回到一个数组中，从而允许在两个调用完成时触发 done 函数。这按预期工作，我可以获得我需要的所有数据。

但是，初始化函数中的流程不会在触发提取时停止，因此在 LayoutManager 继续进行 beforeRender 之前，集合不会及时填充。我怎样才能异步获取，但让初始化函数等到两个 ajax 调用完成并填充集合？

Answer 1

如果您想以 Backbone 方式进行操作，您应该在 done 回调中触发一个“重置”事件。然后，您在 View 中收听此事件以启动 render 函数。将 that.add( models ) 替换为 that.reset( models ) 将为您添加模型并触发事件。

然后在 View 的初始化函数中:

// ...
this.listenTo( collection, 'reset', this.render, this );

this.render 函数将在获取完成时被调用。