javascript - 带有mapping.fromJS和模板的Knockoutjs

我已经更新了一个表，其中更新了模型中的每个条目，并在删除和添加到数组时触发了两个事件。 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);
    };
};
...

问题在于，每次在ajax响应中调用ko.mapping.fromJS(response, self.entries)时，即使它们完全相同，敲除似乎都在删除/添加条目。因此，调用showElement / hideElement并且表中的元素“闪烁”，因为每个ajax调用都将其删除/添加。

是应该这样吗？还是我用错了？

最佳答案

您需要在映射插件中使用key选项，以便该插件知道哪些项目相同

http://jsfiddle.net/yWwfz/

var mapping =  {
    items: {
        key: function(item) { return item.id; }
    }
};
ko.mapping.fromJS(data, mapping, this);

关于javascript - 带有mapping.fromJS和模板的Knockoutjs，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14423952/