Question

在backbone.js中预取下一页的最佳方法是什么？是否有内置机制来执行此操作，或者我必须通过进行Ajax调用并存储结果来自行处理它。另外，有没有办法像JQuery mobile（http://jquerymobile.com/demos/1.2.0/docs/pages/page-cache.html）

那样预加载整个页面

Answer 1

没有内置支持这样的东西。这取决于你的用例，但你可以做很多事情。

1）在获取您可能需要的数据之前，使用setTime（）等待一小段时间。（可能不是一个好的解决方案）

2）设置一个事件处理程序来获取特定事件或类似事件的数据：

$('#my-button').on('hover',function() { 
//fetch data
});

要获取数据，您可以在骨干模型或集合上使用fetch（）函数，它将返回jqXHR（或者您可以使用直接的$ .ajax（）调用）。然后，您可以等待，看看它是否失败或通过：

 var fetch = myModel.fetch();
 fetch.done(function(data) {
   // Do something with data, maybe store it in a variable than you can later use
 })
 .fail(function(jqXHR) {
   // Handle the failed ajax call
   // Use the jqXHR to get the response text and/or response status to do something useful

 });

Answer 2

没有内置支持，但实际上很容易添加。请参考View Manager的概念，它能够处理“视图保持”任务和transitions。

简而言之，概念是：视图管理器是组件，可以从一个应用程序视图切换到另一个应用程序视图。它将dispose现有视图，因此它可以防止僵尸和内存泄漏。它也可以处理视图切换之间的转换。

Answer 3

我的方式是如何将页面加载到“无限滚动”列表中。

让后端分页识别

首先，您需要一个能够处理页面加载请求的数据库后端：作为一个例子，请参考我的git modelloader项目，它提供了一个集成到Node.js / Moongoose环境中的基于Coffee的小型框架。

Model Loader on GIT将包含其他信息和示例。

这里最重要的一点是：

您的后端应支持以下分页功能

每个请求都将返回部分响应，仅将其限制为例如20条记录（页面大小）。

默认情况下，请求返回的最后一个JSON记录条目将包含有关请求的其他技术和元信息，这是允许使用者实现分页所必需的。

{
    _maxRec: "3",
    _limit: "20",
    _offset: "0"
}

_maxRec将列出集合中的记录总数
_limit将列出已返回的最大请求数
_offset将告诉您传回了哪一组记录，即_offset 200意味着结果列表跳过前199条记录并显示来自{{1的记录}}

后端应支持以下分页控制参数：

200-220

使用http(s)://<yourDomainName>/<versionId</<collection>?offset=<number>跳过大量记录，例如限制为20，您会发送第一个请求offset然后offset=0，然后offset=20直到你到达offset=40。

为了减少数据库活动，您应该提供减少后续请求的_maxRec计算的可能性：

_maxRec

通过传入http(s)://<yourDomainName>/<versionId</<collection>?maxRec=<number>参数（通常是早期分页请求获得的参数），请求处理程序将传递数据库计数对象语句，这会导致一个db活动减少（性能优化）。传入的数字将通过maxRec条目传回。通常，消费者将在第一个请求中获取_maxRec号码并将其传回给后续请求，从而产生更快的数据访问请求。

在必要时激活Backbone模型

所以现在你必须在Backbone一侧实现必要时激活页面加载请求。

在下面的示例中，我们假设有一个_maxRec，其列表已加载到基于Backbone.View的HTML元素中。该列表包含最初构建时通过URL加载的前20条记录：

jquery.tinyscrollbar

在这种情况下，View会监听以下滚动事件

http(s)://<yourDomainName>/<versionId</<collection>?offset=0

目标是用户一直向下滚动到可滚动列表的底部（例如，他到达可滚动列表终点上方30px的点），将触发请求以加载接下来的20个条目。以下代码示例描述了必要的步骤：

events:
 'mousewheel': 'checkScroll'
 'mousemove': 'checkScroll'

视图的渲染方法将返回响应，并将更新可滚动列表，该列表的大小将会增加，并允许用户再次沿着新加载的条目向下滚动。

这将以分页的方式很好地加载所有数据。

在backbone.js中预取的最佳做法是什么？

3 个答案: