javascript - 每次计算的可观察值发生变化时运行一个函数

Question

我有一个 Knockout View 模型，其中包含一个计算的可观察值，它根据文本输入的内容简单地过滤一些原始数据。然后，将此计算出的可观察量绑定(bind)到表以显示信息。

每次计算计算的可观察量时，我都需要运行一个函数来更新表行上的一些事件监听器(我已经有这个函数)。

但是，我一直无法理解如何在计算的可观察值更新后让它运行。在返回新值之前，在可观察函数中调用该函数会执行此操作，以便使用遗留数据对其进行操作。我也考虑过扩展语法，但认为这是一个不合适的解决方案。

如果有人有解决方案或任何指示，我将不胜感激。

使用代码更新:

var viewModel = function(data) {
    var self = this;
    self.search = ko.observable('');
    self.rawData = ko.observableArray(data);
    self.filterData = ko.computed(function() {
        return self.rawData().filter(function(item) {
            var filter = self.search().toLowerCase();
            return item.employeeNumber.toString().includes(filter) || item.name.toLowerCase().includes(filter) || filter == "";
        });
    });
};

异步函数使用返回的数据创建一个新的 View 模型并应用绑定(bind)。

function reevaluateHandlers() {
    // Code that should run every time the computed observable is calculated (filterData)
}

Answer 1

多种方法来做到这一点:

1. 在此函数之后有另一个计算函数，这将在您的第一个计算函数之后触发。

   self.filterData = ko.computed(function() {
       return self.rawData().filter(function(item) {
           var filter = self.search().toLowerCase();
           return item.employeeNumber.toString().includes(filter) || item.name.toLowerCase().includes(filter) || filter == "";
       });
   });
   
   self.reevaluateHandlers = ko.computed(function() {
       var rawData = self.rawData();
       var filter = self.search();
       reevaluateHandlers();
   });
   

2. 简单的超时函数，reevaluateHandlers函数将在数据返回后触发

   self.filterData = ko.computed(function() {
       var rawData = self.rawData();
       var filter = self.search().toLowerCase();
       var filteredData = rawData.filter(function(item) {
           return item.employeeNumber.toString().includes(filter) || item.name.toLowerCase().includes(filter) || filter == "";
       });
   
       setTimeout(function() {
           reevaluateHandlers();
       }, 100);
   
       return filteredData;
   });
   

我认为第一个解决方案更有效，尽管我会使用以下方法优化filterdata代码:

var filter = self.search().toLowerCase();

它虽然很小，但会产生影响，尤其是随着数组大小的增加。另请查看 linqjs 和 knockout 可暂停计算，因为这样您就可以控制计算何时触发。