敲除事件绑定意外行为

Question

我有一个 DIV 上 scroll 事件的事件绑定。为了去除处理程序的抖动，我在我的模型上引入了一个函数来创建去抖动的处理程序，并且我在我的视图中绑定了这个工厂函数。

我希望我的工厂创建 debounced 函数并且 knockout 会将其绑定到事件。相反，似乎 knockout 会在每个事件触发时重新创建并调用我的 debounced 函数，因此 debouncing 根本不起作用。

我的看法

<div data-bind="event.scroll: getScrollHandler()"></div>

我的模型

var viewModel = {
  getScrollHandler: function(data, evt) {
    return debounceFunction(function(data, evt) {
      // dp the actual handling...
    });
  }
};

我希望 getScrollHandler 方法在绑定初始化时只执行一次，它会绑定返回的函数。

相反，knockout 似乎将其全部包装到一个新函数中，因此它会在每个滚动事件上运行。

它在 Knockout 中究竟如何运作？

更新

由于我使用的是 TypeScript 并且此处理程序是 class 的成员方法，因此我仅限于这种函数成员分配，我无法直接将去抖函数分配为成员（或实际上我可以，但只是以一些更丑陋的方式。

Answer 1

假设您有一个实现 similar to this one，它的想法是创建一个新函数，然后您可以使用该函数代替原始函数。尝试将您的代码更改为：

getScrollHandler: debounceFunction(function(data, event) { 
  ...
})

这将创建该函数一次，并且 re-use 每次激活滚动时都会创建该函数。

敲除事件绑定意外行为

Knockout event binding unexpected behaviour

javascript

events

knockout.js