Knockout计算单个动作多次触发

时间:2014-03-06 21:40:37

标签: javascript knockout.js

我正在使用我正在处理但未构建的软件的淘汰赛问题。有问题的页面在编辑几乎任何字段时都会执行自动保存。该页面显示多个测试问题,每个测试问题都有相关的响应(答案)。自动保存使用脏标志实现,该标志将对象的当前状态与初始状态进行比较。

我看到的症状是,第一次访问页面并添加新问题会导致1个新问题的api调用(这是正确的)。如果我导航到另一个页面并返回相同的测试(或不同的测试),则所有api调用都会重复。如果我再次重复同样的事情,则会进行3次调用(完全相同)。我的理论是VM / observable中的某些内容在离开页面时没有正确设置。我已经调试了很多,我认为没有多个不同的动作触发保存,但是1动作导致计算函数的触发,每次打开任何测试时触发自动保存。刷新浏览器会导致此隐形计数器重置。

有两个计算函数

self.dirtyQuestions = ko.computed(function() {
  return ko.utils.arrayFilter(self.current.assessmentItems(), function(question) {
    return question.dirtyFlag.isDirty();
  });
}, self).extend({ throttle: 250 });

self.triggerDirtyQuestionSave = ko.computed(function() {
  if (!CONFIG.editing.autoSave) {
    return;
  }
  if (self.dirtyQuestions().length > 0) {
    self.saveQuestions(self.dirtyQuestions(), true);
  }
}, self);

似乎完全依赖于一个可观察的数组

  assessmentItems: ko.observableArray([]),

这是一个与之相关的许多障碍物的物体。如果修改了其中任何一个或推送了新项目,则会在上面的两个计算中触发自动保存。在调试时,我看到这些都在离开和重新访问页面后被多次触发,但是我对可见度监视器中元素修改的所有断点只会触发一次。

我的具体问题是,如何在离开页面时确定页面/ VM / observablearray的某些内容是否会在离开并返回可能解释这些重复触发器的页面时导致累积?该页面有点乱,但也相当复杂,所以我试图避免重写它或删除所有的自动保存功能。

- 更新

路线表条目

        create: {
      enter: [
        checkForUnsavedChanges,
        function () {
          self.closeOverlay();
      }],
      to: function() {
        assessmentAuthoringVM = new AssessmentAuthoringVM(self);
      },
      exit: function() {
        if (assessmentAuthoringVM) {
          assessmentAuthoringVM.destroy();
        }
      }
    },

1 个答案:

答案 0 :(得分:1)

在“页面”关闭时运行的函数中,您应该添加调用“dispose”计算的observable:

destroy: function () {
    self.triggerDirtyQuestionSave.dispose();
    self.dirtyQuestions.dispose();
}