8

我有一个使用外部 API 填充的集合，API 返回许多对象 + 更多对象的分页详细信息，然后我想在我的视图中可能只显示这些对象的一个​​子集，但允许进一步的分页视图也

为了更好地解释我的情况：

  1. 从服务器获取 20 个结果，获取更多页面的分页数据
  2. 显示 10 个结果 + 更多按钮
  3. 点击更多，显示 10 个结果 + 更多按钮
  4. 点击更多，从服务器获取 20 个结果，显示 10 个结果 + 更多按钮...

你的解决方案是什么？我找到了Backbone.Paginator，但我不知道它与 Marionette 的集成情况如何，或者是否已经存在Backbone.Marionette.Paginator扩展:)

4

2 回答 2

8

Backbone.Paginator 在 Backbone 集合之上提供了扩展和额外的方法和特性，这意味着它们应该可以从任何类型的 Backbone 视图中使用，包括 Marionette。

那么，您不需要做任何特别的事情来集成 Marionette 和 Paginator。您将构建一个利用附加方法和特性的视图，但是您将基于 Marionette 的视图而不是标准的 Backbone 视图来构建该视图。在这种情况下，我建议使用 Marionette 的集合视图或复合视图，分别呈现分页集合中的每个项目。

于 2012-07-17T13:54:27.247 回答
4

下面是我如何解决集成 Marionette 和backbone.paginator 的问题。从某种意义上说，这是“直截了当”的，但作为一个新来的骨干。牵线木偶它让我烦恼了一段时间！我希望这对某人有用。

使用复合视图上的 serializeData 方法从分页器的 paginator_ui 对象呈现信息。

/* a view for presenting a backbone.paginator collection,
 * and for presenting and handling its pagination UI element */
App.module('Views', function(Views, App, Backbone, Marionette, $, _) {
    Views.PaginatedCollectionView = Backbone.Marionette.CompositeView.extend({
        template: 'backbone/templates/paginated_collection_view',
        itemView: App.Views.StructureView,

        /* I'm not using a model, but you could if you
         * wanted? You might even merge the two */
        serializeData: function(){
          if (this.model){
            data = this.model.toJSON();
          } else {
            // we want to render the paginator_ui in our templates
            data = this.collection.paginator_ui;
          }

          return data;
        }
    });
});
于 2013-10-07T10:15:23.283 回答