2

我们正在对由多个视图模型组成的 SPA 使用敲除，以处理可见的视图，我们已经包装了 div，在其中我们用 bindings绑定了“子”视图模型。

我们看到的问题是，当切换视图可见性时，每次都会执行其中的自定义绑定，包括初始化和更新。

当我们有一个基于此jqdialog 绑定的绑定时，这会给我们带来一个问题，并且在每次初始化时都会创建一个新对话框并将其附加到我们的 DOM 中，但我们没有简单的方法知道何时应该删除它。

或多或少是一个问题，即我们是否应该重新排列我们架构的这一部分，或者我们的绑定中是否缺少某些东西。

简单视图：

<div id="view">
  <button data-bind="click: on">On</button>
  <button data-bind="click: off">Off</button>

  <div data-bind="with: visible">
    <span data-bind="foo: ''">foo</span>
    visible
  </div>

</div>​​​​​​​​​​

JS：

ko.bindingHandlers.foo= {
  init: function() {
    alert("init");
  },
  update: function() {
    alert("update");
  }
}


var vm =(function() {
  var self = this;
  self.visible = ko.observable(false);

  self.on = function() { self.visible(true); };
  self.off= function() {self.visible(false); };

})();

ko.applyBindings(vm, document.getElementById("view"));

​</p>

一个小小提琴大致显示了我们的错误。

4

1 回答 1

2

您的问题是您没有切换可见性。当您使用时，with您每次都将相同的元素删除并重新插入到 DOM 中。当然，这会导致重新创建绑定并init再次触发函数。

如果您只想隐藏/显示，请改用可见绑定。

所以如果你这样做：

<div data-bind="visible: visible">
    <span data-bind="foo: ''">foo</span>
    visible
</div>

您会在页面加载时看到绑定初始化，并且在显示/隐藏时不会再次初始化。见这里。

于 2012-11-05T15:13:36.370 回答