我正在使用组件在一个或另一个视图之间切换。那是what I was recommended to do。
现在，每次我在视图之间切换时，都会再次加载数据。 Here's a reproduction of the issue.（检查控制台）。
在我提供的示例中这没什么大不了的，但是在调用外部 API 时就很重要了。
我怎样才能避免这种情况？
作为一个相关问题，目前它在加载时调用 API（或在我的示例中加载数据）两次。每个注册的组件一次。那也不应该是这样的。
我是否应该使用 jQuery / Javascript 通过 ajax 调用 API，然后在视图模型中设置数据后？
$.getJSON("/some/url", function(data) {
viewModel.setData(data);
})
【问题讨论】：
标签： knockout.js knockout-3.0 knockout-3.2
问题在于，在您的组件定义中，您正在使用为组件指定 viewModel 的 constructor function 方法，因此每次使用该组件时，它实际上是在实例化一个全新的视图模型。
作为一个相关问题，目前它在加载时调用 API（或在我的示例中加载数据）两次。 每个注册的组件一次。也不应该是这样的。
请注意，它调用它一次是因为您自己调用了new viewModel()，而当它实例化额外的视图模型时，它调用了一次显示初始组件。它没有被记录两次，因为您注册了两个组件 - 如果您 register more components，您会看到它仍然只记录了两次。
您的快速解决方法是使用shared object instance 方法指定viewModel：
var vm = new viewModel();
ko.components.register('summary', {
viewModel: {instance: vm},
template: '...'
});
ko.components.register('details', {
viewModel: {instance: vm},
template: '...'
});
ko.applyBindings(vm);
如果这对您的整个项目来说是正确的方法，您将不得不决定长期，有几种方法可以将数据传递到组件中，这只是其中一种。
这是一个updated fiddle，它只记录一次loading data。
【讨论】：