javascript - Backbone.js - 更改事件未触发

Question

<div class='container'></div>

<script>
// Define models.  View is a div with a counter.
Tasks = Backbone.Collection.extend({localStorage: new Store("tasks")})
Tasks = new Tasks
Tasks.bind('add', function (task_model) {
  task_model.bind('change', function(){ render(this) })
  $('.container').append(render(task_model))
})

function render(model) {
  console.log('rendering, daily_times: ', model.get('daily_times'))
  var div = '<div class="current task_time" task_id="%id">%time</div>'
  var time_str = model.get('daily_times')['Jun 28 2011']
  div = div.replace('%id', model.id).replace('%time', time_str)
  $('div[task_id="%id"]'.replace('%id', model.id)).replaceWith(div)
  return div
}

// Start pinging
setInterval(ping, 1000)
Tasks.create({daily_times:{'Jun 28 2011':0}})
function ping() { 
  console.log('ping')
  Tasks.each(function(task) {
    var times = task.get('daily_times')
    times['Jun 28 2011'] += 1
    task.set({daily_times:times})
    console.log('incremented, time: ', task.get('daily_times')['Jun 28 2011'])
  })
}
</script>

当我在 ping 中设置 daily_times 时，为什么 change 事件没有触发？

Answer 1

看起来 var times 是一个对象而不是一个值。因此，当它使用 _.toEqual 方法查看新值是否与旧值相同时，它实际上是将对象与自身进行比较并返回 true，因此 backbone 决定无需触发 change 事件。

您可以使用 task.change() 显式触发更改事件。