knockout.js - 如何交换 observableArray 中的两个项目？

Question

我有一个按钮，可以将一个项目在 observableArray 中向左移动一个位置。我正在按照以下方式进行操作。然而，缺点是 categories()[index] 被从数组中删除，因此丢弃了该节点上的任何 DOM 操作(在我的情况下通过 jQuery 验证)。

有没有办法在不使用临时变量的情况下交换两个项目以保留 DOM 节点？

    moveUp: function (category) {
        var categories = viewModel.categories;
        var length = categories().length;
        var index = categories.indexOf(category);
        var insertIndex = (index + length - 1) % length;

        categories.splice(index, 1);
        categories.splice(insertIndex, 0, category);
        $categories.trigger("create");
    }

Answer 1

这是我的 moveUp 版本一步完成交换:

moveUp: function(category) {
    var i = categories.indexOf(category);
    if (i >= 1) {
        var array = categories();
        categories.splice(i-1, 2, array[i], array[i-1]);
    }
}

但是，这仍然不能解决问题，因为 Knockout 仍会将交换视为删除和添加操作。有一个open issue不过，为了让 Knockout 支持移动项目。更新:从 2.2.0 版开始，Knockout 可以识别移动的项目和 foreach绑定(bind)不会重新渲染它们。