Knockout 组件与其他 viewModels 共存

Posted 2023-03-27

【中文标题】Knockout 组件与其他 viewModels 共存

【英文标题】：Knockout components and other viewModels coexistence

【发布时间】：2020-06-25 11:47:11

【问题描述】：

我了解到，在注册淘汰组件后，应该调用ko.applyBindings() 而不带参数。但是，当定义另一个没有组件的 viewModel 时，我们称之为vm，应该调用ko.applyBindings(new vm())。现在当我尝试同时使用两者时，我得到一个错误

You cannot apply bindings multiple times to the same element.

另见this fiddle

我可以做些什么来完成这项工作？

【问题讨论】：

先注册组件，然后用你的主视图模型调用applyBindings一次。 Knockout 将负责为您的组件创建一个新的视图模型实例。 jsfiddle.net/734z80gr

谢谢你的回答，这是有道理的。很高兴看到它像这样工作。不幸的是，我不能那样做，因为我正在一个项目中工作，首先我定义和使用我自己的组件，然后，另一个 html 页面通过 $.load 加载，其中有一个脚本标记 viewModel已定义，并在该视图模型上调用 applyBindings。我怎样才能避免这些冲突？因为我必须先调用applyBindings，否则我无法使用我的组件

【参考方案1】：

我找到了答案。问题是你不能在没有第二个参数（也就是绑定范围的 HTML 元素）的情况下调用 applyBindings 两次。对于我的组件，我很乐意提供第二个参数，即组件本身，但这在文档中不存在，您只能找到 applyBindings() 没有任何参数。所以，通过反复试验，我发现

ko.applyBindings(null, document.getElementById('id'))

id 是组件 HTML 元素的 id，有效。