Question

我有一个非常奇怪的问题。我有一个Backbone集合，我使用where方法在集合中查找与某个属性匹配的模型。我的问题是结果不一致。

我有一个joinGoalList，用于跟踪用户加入的目标。假设这个集合包含ID为1和3的两个目标。当用户访问/ goals / 3时，应显示一条消息，说明用户已加入目标

我遇到问题，我正在访问/ goals / 3，有一半时间显示消息，另一半时间，消息不显示。

奇怪的是，这个问题只发生在我的远程服务器上，而不是发生在我的本地主机上。

在我的代码中，我查询了joinGoalList的ID为3，如果匹配，我知道匹配数组必须大于0，所以我渲染显示用户已加入目标的消息。 / p>

这是代码（joinedGoalList是一个Backbone集合：

  console.log(joinedGoalList);
  var matches = joinedGoalList.where({id: this.model.get("id")});
  console.log(matches);
  console.log(matches.length);
  if (matches.length > 0) {
    console.log("the matches length is > 0");
    this.renderLeaveGoal();
  } else {
    console.log("the matches length is 0");
    this.renderJoinGoal();
  }

以下是console.log(joinedGoalList)的结果，以下是结果（它们是一致的）：

child
_byCid: Object
_byId: Object
_callbacks: Object
length: 2
models: Array[2]
__proto__: ctor

如您所见，长度为2.其中一个对象的ID为1，另一个对象的ID为3.这在整个页面加载过程中是一致的。

当我在数组上为ID为3的对象进行匹配时会出现不一致。某些页面加载会找到匹配项，而其他页面加载则找不到匹配项。

我的远程服务器上console.log(matches.length)的结果为0或1，但在我的localhost上，结果始终为1.

Answer 1

我很确定事件的顺序是这样的：

您在集合上调用fetch以从服务器加载数据。
您致电console.log(joinedGoalList)，这在某些浏览器中是异步的。
您致电joinedGoalList.where并找到一个空集合。
来自 1 的fetch电话会返回并填充该集合。
来自 2 的console.log电话执行并打印出已填充的集合，此调用将引用joinedGoalList，该引用现在将指向已填充的集合

当您在本地执行此操作时， 4 中的AJAX fetch会很快返回，因此在 3 之前发生 4 步骤表现得像你期待的那样。

你有几个选择：

fetch有一个success回调：

选项哈希需要success和error个回调，这些回调将作为参数传递(collection, response)。

因此，您可以使用success回调延迟调用where的任何内容，直到服务器响应并填充集合。
fetch重置了该集合：

当模型数据从服务器返回时，集合将重置。

和reset将

使用新的模型列表（或属性哈希）替换集合，最后触发单个"reset"事件。

因此，您可以侦听"reset"事件并使用该事件触发调用where的任何内容。

数组有时显示长度为0

1 个答案: