Backbone.js 在集合添加时触发渲染两次

我正在使用 Todos 示例应用程序与最新版本的 Backbone 捆绑在一起(0.9.2) 在学习 Backbone.js 时。我的问题是，为什么应用程序设计为在将模型添加到 Todos 集合时触发渲染事件两次？

如果我将此行放在 TodoView 的渲染函数中：

// Re-render the titles of the todo item.
render: function() {
  console.log("Rendering!");
  this.$el.html(this.template(this.model.toJSON()));

然后“渲染！”在控制台中出现两次。我理解这是因为视图将模型的更改事件绑定到视图的渲染：

initialize: function() {
  this.model.bind('change', this.render, this);

并且在addOne中调用render，它绑定到Todos的add事件：

addOne: function(todo) {
  var view = new TodoView({model: todo});
  this.$("#todo-list").append(view.render().el);
},

但这是双重渲染设计的标准做法吗？看起来视图应该在创建时渲染（或进入 DOM），然后在底层模型发生变化时再次渲染。在这种情况下，没有任何更改，但渲染被调用了两次。

再说一次，我刚刚学习 Backbone，所以我可能有一个基本的误解，导致我的困惑。

嗯，快速浏览了一下。你是对的，这种情况发生了，不，这不是标准做法。 原因有点晦涩难懂，所以请耐心听我说；）

todo 应用程序正在使用主干本地存储。当您尝试在应用程序中添加新项目时，它会调用：

createOnEnter: function(e) {
  if (e.keyCode != 13) return;
  if (!this.input.val()) return;

  Todos.create({title: this.input.val()});
  this.input.val('');
},

注意Todos.create。通常是一个create会将模型添加到集合中并将其保存在服务器上。这add事件将因此被触发。尽管骨干本地存储会执行以下操作，但会发生这种情况create:

create: function(model) {
  if (!model.id) model.set(model.idAttribute, guid());
  this.data[model.id] = model;
  this.save();
  return model;
},

注意model.set给模型一个id。这就是触发（第二个）的原因change event.

您可以通过将 create 更改为 do 来阻止这种情况发生：

if (!model.id) model.id = guid();