javascript - knockout js变量设置类似于调用函数

Question

我有一个名为enable的变量，我这样分配:

var enable = ko.observable();

在一个方法中，我将其值设置为:

enable(false);

如果我这样做

enable = false;

然后，如果我在 console 中看到启用的值，则该值未设置。这是什么原因？

Answer 1

knockout observables是函数，因此您可以通过在所需值上调用它们来设置它们的值:

myObservable(myValue);

以下引用对此进行了解释:

"Not all browsers support JavaScript getters and setters (* cough * IE * cough *), so for compatibility, ko.observable objects are actually functions."

如果将它们直接设置为值，则会覆盖它们，并且它们不再是可观察的，这会破坏一切。

看看这个 fiddle :

var myVM = (function() {
  var showobservable1 = ko.observable(true);
  var showobservable2 = ko.observable(true);
  return {
    show1: showobservable1,
    show2: showobservable2,
    ok: function() {
      showobservable1(!showobservable1());
    },
    broken: function() {
      showobservable2 = !showobservable2;
    }
  }
}());

ko.applyBindings(myVM);

div {
  width: 100px;
  height: 40px;
  margin-top: 10px;
  background-color: yellow;
  text-align: center;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div id="1" data-bind="visible: show1">1</div>
<div id="2" data-bind="visible: show2">2</div>
<div id="ok" data-bind="click: ok">works</div>
<div id="broken" data-bind="click: broken">break</div>