knockout.js - 如何在 knockout.js 中的第一个事件后显示一次服务器响应并清除？

Question

在 ajax 发布后，我想显示“您的订单已收到：链接”。在用户第一次交互（viewModel 中的任何更改）后，我想清除消息。

我怎么能用 knockout.js 做到这一点

看法：

<div data-bind="text:serverResponse,visible:serverResponseActive"></div>

也许是可写的计算 observables？如何？

Answer 1

您可以尝试的一种方法是将event绑定添加到要从中清除服务器消息的任何客户端可交互元素。所以，像：

<input type="text" data-bind="event: { mouseover: clearResposne, click: clearResponse}" />

// viewmodel code (object literal style)
clearResponse: function() { this.serverResponseActive = false; },

大页面可能会有点凌乱，但对于一两件事，它会非常整洁和紧凑。

另一种方法是在收到服务器响应时设置超时，在 x 秒内清除标志。

// In the view model (constructed object style)
var self = this; // to un-confuse the closure function 'this'

// In the ajax response
setTimeout(function() { self.serverResponseActive = false }, 5000);

在用户操作后将两者结合起来延迟。

编辑：第三种方法，受您的启发

在用户第一次交互（viewModel 中的任何更改）后，我想清除消息。

手动订阅 viewModel 中的所有其他 observable。如果你有一堆可观察的东西，可能会非常混乱。

myViewModel.personName.subscribe(function(newValue) {
    setTimeout(function() { self.serverResponseActive = false }, 5000);
});

如果您真的有一大堆 observable，请考虑为它们制作自定义绑定，其中包含订阅/超时。