javascript - 如何在不使用 ko.cleanNode 方法的情况下对同一元素使用 applyBindings

Question

我正在KnockoutJS中创建简单的应用程序，在这里我需要更多的输入元素来通过单击按钮进行更新。我使用了 ko.applyBindings(viewModel)，但它抛出以下错误。

Uncaught Error: You cannot apply bindings multiple times to the same element. at applyBindingsToNodeInternal (VM88 knockout-debug.js:3287)

我找到了一个解决方案，如果我使用ko.cleanNode(node)它可以解决我的问题。但我不想要这个，因为我有很多输入元素。所以显然我需要为每次按钮点击清理每个节点。通用中的任何其他解决方案都可以对同一元素使用 applyBindings ，否则我需要更改核心？

applybind = function() {
  viewModel = {
    nValue: ko.observable(10)
  }
  //ko.cleanNode(document.getElementById("txt")); // Don't want this.
  ko.applyBindings(viewModel);
}

ko.applyBindings({
  nValue: ko.observable(100)
}); //initial load.

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<input type="text" id="txt" data-bind="value: nValue" />
<input type="button" value="update value" onclick="applybind()" />

Answer 1

一般来说，ko.applyBinding 方法应该只调用一次。之后，您可以简单地更改可观察值，更改将立即反射(reflect)在 UI 中。我已相应地更改了您的截图。

viewModel = {
  nValue: ko.observable(100)
}

applybind = function() {
  viewModel.nValue(10);
}

ko.applyBindings(viewModel); //initial load.

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<input type="text" id="txt" data-bind="value: nValue" />
<input type="button" value="update value" onclick="applybind()" />