避免更新本地客户端

时间:2015-01-04 14:11:22

标签: javascript meteor polymer

我试图在Meteor中使用Polymer,但是如果你让状态变为反应状态,那么具有切换状态的元素会出现一些问题,例如paper-checkbox

纸张复选框是常规复选框的更高版本。它在两个状态已检查未选中之间交替显示。如果您点击该复选框,聚合物事件将触发并切换状态。

当您使复选框状态为反应时,会出现问题。您将在Polymer和Meteor之间获得竞争条件。 Polymer只是将复选框状态切换到当前状态的反面,Meteor根据集合中的值设置元素状态。

因此,根据哪个事件赢得比赛,复选框设置为正确状态或再次切换,因此显示错误状态。 集合中的状态始终是正确的,但前端显示混乱了。

这是我的模板代码:

<template name="task">
  <paper-checkbox class="toggle-checked" {{isChecked}}></paper-checkbox>
  <span class="text">{{text}}</span>
</template>

和相关事件&amp;助手:

Template.task.events({
  "click .toggle-checked": function (e) {
    // Set the checked property to the opposite of its current value
    Meteor.call("setChecked", this._id, ! this.checked);
  }
});

Template.task.helpers({
  isChecked: function () {
    return this.checked ? 'checked' : 'unchecked'; 
  }
});

Meteor.methods({
  setChecked: function (taskId, setChecked) {
    var task = Tasks.findOne(taskId);
    Tasks.update(taskId, { $set: { checked: setChecked} });
  })
});

有没有办法阻止在Task.update()调用后更新本地客户端的流星,但保持其他客户端的反应性?

1 个答案:

答案 0 :(得分:2)

尝试更改您的事件处理程序:

Template.task.events({
  "change .toggle-checked": function (e) {
    var checked = e.currentTarget.checked;
    if (checked !== this.checked) {
      Meteor.call("setChecked", this._id, checked);
    }
  }
});