1

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

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

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

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

在我的代码中，我在joinedGoalList 中查询ID 为3，如果它匹配，我知道matches 数组必须大于0，因此我呈现了显示用户已加入目标的消息。

这是代码（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，但在我的本地主机上，结果始终是 1。

4

1 回答 1

1

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

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

当您在本地执行此操作时，4 中的 AJAXfetch会很快返回，因此第4步发生在第 3步之前，并且一切都按照您期望的方式运行。

你有几个选择：

  1. fetch有一个success回调：

    选项散列success和error回调将作为(collection, response)参数传递。

    因此，您可以使用success回调来延迟正在调用的任何内容，where直到服务器响应并填充集合。

  2. fetch重置集合：

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

    并将reset_

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

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

于 2012-05-02T17:45:27.737 回答