jquery - 展开 Treeview promise

Question

我正在帮助客户处理一些 KendoUI 的东西，我们正在使用 Treeview 来构建组织层次结构。

他们在树上方有一个搜索框(自动完成)，当他们选择某人时，它会扩展树，在树中找到他们，选择他们，如果他们不在 View 中(treeview 在可滚动的 div 中)，它会将他们滚动到看法。

我遇到的问题是，我的 scrollTop 动画发生在 Treeview 完全扩展之前。 (我应该提到我在树上关闭了 loadOnDemand (现在)以加快使用 expand('.k-item')) 扩展整个树。

一些代码:

//in the autocomplete select event handler:
treeView.expand('.k-item');

treeView.select(selectedItem);

var treeTop = treeView.element.offset().top,
elTop = treeView.select().offset().top,
offsetDiff = elTop - treeTop;

treeView.element.animate({scrollTop: offsetDiff}, 100);

如果我将 animate 包装在超时(大约 300 密耳)中，它适用于中型组织。但如果我们有一个大型组织，可能时间不够。

如果我能兑现 promise ，那就更好了。我试过了:

treeView.expand('.k-item').promise().done(//animate);

甚至尝试将 expand 包装在一个带有 defer 和 promise 的函数中，但是在树完全展开之前对 expand 的调用又回来了。

Answer 1

我认为使用 setTimeout 的值大于您作为 options.animation.expand.duration 传递的值应该就足够了(我认为设置默认为 200)。

如果你想将 expand 方法包装在一个 promise 中，我认为这样的事情应该可行:

kendo.ui.TreeView.fn.expand = (function(expand) {
    return function(nodes) {
        var that = this,
            deferred = $.Deferred(),
            animationDuration = this.options.animation.expand.duration;

        setTimeout(function() {
            expand.call(that, nodes);
            setTimeout(function() {
                deferred.resolve();
            }, 5 + animationDuration);
        }, 5);

        return deferred.promise();
    }
})(kendo.ui.TreeView.fn.expand);