在 ExtJS 中 AJAX 结束之前扩展树节点

Question

我的树面板上有一个搜索栏。当我写一些东西并按下回车键时，一个 Ajax 请求会触发并返回将树展开到请求的文件夹点所需的文件夹 ID。在 ajax.request 的成功配置中，我使用循环通过 getNodeById 调用每个节点的扩展函数。然而，在第一次扩展后，ExtJS 会触发来自代理的 ajax 请求以获取文件夹数据（因为它尚未加载）。由于 AJAX 是异步的，因此循环比服务器响应更快，它会在节点本身加载之前尝试调用节点的 .expand() 函数并给出未定义的错误。我应该如何解决这个问题？我知道通常使用 AJAX，您必须在处理请求后对要运行的所有内容使用回调函数，但我不确定在这种情况下如何执行此操作...

Ext.define('treeStore', 
{
    extend : 'Ext.data.TreeStore',
    alias: 'widget.treeStore',
    autoLoad : false,
    model : 'treeModel',
    root :  {
        id: 0,
        name : 'Root', 
        expanded : true,
        loaded: true
    },
    proxy :  {
        type : 'ajax', 
        url : 'MyServlet', 
        reader :  {
            type : 'json', 
            root : 'children'
        }
    },
    folderSort: true
});

Ext.define('Ext.tree.Panel',{
.
.
.
//Stuff about the tree panel etc.
dockedItems: {
        xtype: 'textfield',
        name: 'Search',
        allowBlank: true,
        enableKeys: true,
        listeners: { 
            specialkey: function (txtField, e) { 
                if (e.getKey() == e.ENTER){
                    var searchValue = txtField.getValue();
                    Ext.Ajax.request({
                        url: 'MyServlet',
                        params: {
                            caseType: 'search',
                            value: searchValue
                        },
                        success: function(response) { //ATTENTION: When calling the .expand() the AJAX hasn't finished and cannot find the node.
                            response = Ext.decode(response.responseText);
                            var panel = txtField.up();
                            response.IDs.forEach(function(entry){
                                panel.getStore().getNodeById(entry.folderId).expand(); <-problem here
                            });
                        }
                    });
                }
            }
        }
    }

Answer 1

在编写我的 Ext 应用程序时，我经常发现即使事情应该按顺序触发，但有时在 AJAX 调用之后立即调用事情有时太快了。也许树节点还没有正确渲染，或者其他问题。

尝试围绕该代码封装一个延迟任务：

new Ext.util.DelayedTask(function()
{
    response = Ext.decode(response.responseText);
    var panel = txtField.up();
    response.IDs.forEach(function(entry){
        panel.getStore().getNodeById(entry.folderId).expand(); <-problem here
    });
}, this).delay(100);

不过，您必须解决这些范围问题。延迟函数之前的“this”就是你的作用域。