javascript - 使用 backbone.js 更新更改的属性

Question

所以我正在设置一个具有更新属性的模型。

然后在我看来，我正在监听此模型的更改事件。

当它触发时我想我应该使用 model.changedAttributes？我是否将回调传递给它？

它应该返回所有更新的或新的属性的散列？无论如何要知道哪些是更新的，哪些是新的？

一旦我有了更改属性的散列值，我应该如何进行更新？将对象解析为属性类型，还是我应该从一开始就使用更高分辨率的监听器？

谢谢!

Answer 1

如果您的 View 仅显示单个属性 - 例如，如果它是一个显示模型的某些 bool 属性的复选框 - 您应该监听该属性的 'change:attribute_name' 事件，如 the Backbone docs 中所述.

如果您的 View 更复杂并且依赖于多个模型属性 - 例如，如果它是具有“完成”、“文本”和“到期日期”元素的“待办事项”列表项的 View ，则监听 '改变'事件。在这种情况下，您可以选择更新每个事件的所有元素，也可以使用 changedAttributes() 来确定哪些元素需要更新。

为了说明...

使用“change:attribute_name”事件更新属性:

此样式适用于呈现的模型属性数量小于 3 左右的简单 View 。不仅如此，代码会变得有点麻烦。

model.bind('change:done', function() {
    view.doneElement.checked = model.get('done');
});
model.bind('change:text', function() {
    view.textElement.value = model.get('text');
});
model.bind('change:dueDate', function() {
    view.dueDateElement.value = model.get('dueDate');
});

更新“更改”事件的所有内容:

这种样式适用于呈现 4 个或更多属性的复杂 View (3/4 属性计数只是一个粗略的准则，主要基于我个人的意见)。

model.bind('change', function() {
    view.doneElement.checked = model.get('done');
    view.textElement.value = model.get('text');
    view.dueDateElement.value = model.get('dueDate');
});

缺点是对于任何更改， View 的每个元素都会更新。因此，例如，如果有人将待办事项标记为“已完成”，文本将被重新呈现，可能会丢失他们在那里可能拥有的任何选择。有时这类事情是个问题，有时不是 - 您必须根据您的 View 到底在做什么来决定。

仅更新自上次“更改”事件以来更改的内容:

这是上述方法的更细微变化，结合了两种方法的优点。它根据 changedAttributes() 结果更新需要更新的 View 元素。

model.bind('change', function() {
  var diff = model.changedAttributes();
  for (var att in diff) {
    switch(att) {
      case 'done':
        view.doneElement.checked = model.get('done');
        break;
      case 'text':
        view.textElement.value = model.get('text');
        break;
      case 'dueDate':
        view.dueDateElement.value = model.get('dueDate');
        break;
    }
  }
});

最后，我会注意到还有另一种变体，它涉及让 View 存储它所显示的值的散列，并将其传递给 changedAttributes() 方法。这通常是不必要的，所以我不会在这里向您介绍详细信息。