Knockout -带有手动更改通知的计算观察对象

Knockout - Computed Observable with manual Change notification

本文关键字:通知 计算 观察 对象 Knockout      更新时间:2023-09-26

在knockout中,我想写一个computedoobservable,它是从不可观察的值计算出来的。我想手动触发通知。

这可能吗?

计算变量只是一个函数,它在其中的所有可观察对象上注册自定义事件。

当你的内部可观察变量发生变化时,它广播一个notify事件,所有的侦听器捕获该事件并相应地处理。

这个过程听起来很简单,但当您计划使用纯Javascript变量时就不是这样了。您可以参考侦听JavaScript或jQuery中的变量更改。

现在,如果您希望手动实现这一点,基本挑战:

  • 变量可以随时随地更改。您必须手动在各处触发它们的notify事件。如果你错过了,你将得到不正确的数据。
  • 你还必须为绑定添加eventListeners。像total变量,应该计算。
  • 浏览器支持。IE8或之前版本不支持自定义事件,你必须为它添加hack。

我的建议,使用computed(或pureComputed,如果在KO3.2或以上)与可观察对象。这样可以节省大量代码。淘汰赛团队必须经历过这些问题,并在他们的代码中添加了处理方法。你重新发明轮子会在你的代码库中添加大量的代码,如果没有适当的文档,将很难维护。

下面是一个小提琴,我复制了textInput绑定的数字输入。如果你看到,他们有单独的处理IE10IE9IE8或以下。他们甚至对safari小于5有特殊处理。

我完全同意在计算中使用ko.observable变量的另一个答案。如果重新评估不是自动的,我不明白你为什么要用计算机。我建议创建一个普通函数。

我看到的最接近的方法是创建一个虚拟的可观察对象,计算订阅。你可以调用valueHasMutated来强制重新求值:

var a = "A";
var b = "B";
var subscriptionObs = ko.observable();
var ab = ko.pureComputed(function() {
  subscriptionObs();
  return a + b;
});
ko.applyBindings({ab: ab });
b = "C";
subscriptionObs.valueHasMutated();
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<p data-bind="text: ab"></p>