我试图同时使用KnockoutJS和jQuery UI Sortable。我知道这已经做过了(特别是knockout-sortable),但我的用例有一些非常特定的行为,希望避免尝试进行切换。
无论如何,问题非常简单——在使用jQuery UI Sortable移动DOM元素后,当删除绑定到该DOM元素的observableArray元素时,Knockout会表现出奇怪的行为。它将无法删除移动的元素,并且如果掉落到移动的元素位置的元素被删除,它将同时删除那个元素和最初移动的元素。很难用言语表达,但通过this fiddle演示。
问题似乎实际上发生在knockout-2.1.0.js中的以下块中:
这个调用将移动的DOM元素添加到要在移动元素被删除时删除的元素列表中。
因此,对于任何jQuery UI / Knockoutjs天才,是否有一种方法来解决这个冲突,或者我需要完全采取不同的方法来使这些工具和谐地协作?
无论如何,问题非常简单——在使用jQuery UI Sortable移动DOM元素后,当删除绑定到该DOM元素的observableArray元素时,Knockout会表现出奇怪的行为。它将无法删除移动的元素,并且如果掉落到移动的元素位置的元素被删除,它将同时删除那个元素和最初移动的元素。很难用言语表达,但通过this fiddle演示。
问题似乎实际上发生在knockout-2.1.0.js中的以下块中:
function fixUpVirtualElements(contiguousNodeArray) {
// Ensures that contiguousNodeArray really *is* an array of contiguous siblings, even if some of the interior
// ones have changed since your array was first built (e.g., because your array contains virtual elements, and
// their virtual children changed when binding was applied to them).
// This is needed so that we can reliably remove or update the nodes corresponding to a given array item
if (contiguousNodeArray.length > 2) {
// Build up the actual new contiguous node set
var current = contiguousNodeArray[0], last = contiguousNodeArray[contiguousNodeArray.length - 1], newContiguousSet = [current];
while (current !== last) {
current = current.nextSibling;
if (!current) // Won't happen, except if the developer has manually removed some DOM elements (then we're in an undefined scenario)
return;
newContiguousSet.push(current);
}
// ... then mutate the input array to match this.
// (The following line replaces the contents of contiguousNodeArray with newContiguousSet)
Array.prototype.splice.apply(contiguousNodeArray, [0, contiguousNodeArray.length].concat(newContiguousSet));
}
}
这个调用将移动的DOM元素添加到要在移动元素被删除时删除的元素列表中。
因此,对于任何jQuery UI / Knockoutjs天才,是否有一种方法来解决这个冲突,或者我需要完全采取不同的方法来使这些工具和谐地协作?