我的模型中的每个条目都更新了一个表格,并且在删除和添加到数组时触发了两个事件。hideElement 调用 jquery "fadeOut" 和 showElement 调用 jquery "fadeIn" 函数来创建漂亮的淡出/淡入效果。
<tbody data-bind='template: { foreach: entries,
beforeRemove: hideElement,
afterAdd: showElement }'>
我的模型是这样的:
var Model = function() {
self.entries = ko.mapping.fromJS([]);
this.getData = function() {
$.ajax({
url: "/test",
type: "GET",
success: function(response) {
ko.mapping.fromJS(response, self.entries);
...
this.showElement = function(elem) {
if(elem.nodeName == "TR") {
$(elem).fadeIn(500);
}
};
this.hideElement = function(elem) {
if(elem.nodeName == "TR") {
$(elem).fadeOut(500);
};
};
...
问题是,每次ko.mapping.fromJS(response, self.entries)
在 ajax 响应中调用时,即使条目完全相同,淘汰似乎也在删除/添加条目。因此,调用了 showElement/hideElement 并且我的表中的元素“闪烁”,因为它们在每个 ajax 调用中被删除/添加。
是这样的还是我用错了?