javascript - ExtJS 的代码结构

Question

我正在尝试更好地组织我的 ExtJS javascript。我有一个这样的 ExtJS 对象:

Ext.define('QBase.controller.ControlModelConfigurationController', {
    extend: 'Ext.app.Controller',

    views: [
        'ControlModelConfiguration'
    ],

    init: function() {
        console.log('Initialized ControlModelConfigurationController');
        this.control({
            '#testBtn': {
                click: this.loadModel
            }
        });
    },

    loadModel: function() {
        console.log('Load Model....');
        var conn = new Ext.data.Connection; 
        conn.request({ 
                        url: 'partsV10.xml',  
                        callback: function(options, success, response) 
                        {  
                            if (success) 
                            { 
                              alert("AHHH");
                              var dq = Ext.DomQuery; 
                              var xml = response.responseXML; 
                              var nodes = dq.select('part', xml,parent);  
                              Ext.Array.forEach(nodes,handleNode);
                             } 
                        }
        });
    },
    handleNode: function(items) {
        console.log(item.name);
    }  
});

上面发布的代码无效。 Ext.Array.forEach(nodes,handleNode) 会引起麻烦。而不是使用像这样的匿名函数:

...
Ext.Array.forEach(nodes,function(item) {
    console.log(item)});
}
...

我想将匿名函数提取为命名的外部函数。不幸的是，我无法找出正确的语法来建立如上所示的代码结构。

与此同时，我发现，推杆

function handleNode(item) {
    {console.log(item)}
}

在文件的最后工作。是否可以使 handleNode 方法成为对象 - Controller 的“成员”？

提前致谢

克里斯

Answer 1

handleNode 是包含对象的成员。当loadModel被调用时，this包含正确的对象，但是在回调被调用的时候，它不会指向我们感兴趣的那个。你可以保存this 到局部变量 self，并使用它代替。

loadModel: function() {
    var self = this
    console.log('Load Model....');
    var conn = new Ext.data.Connection; 
    conn.request({ 
                    url: 'partsV10.xml',  
                    callback: function(options, success, response) 
                    {  
                        if (success) 
                        { 
                          alert("AHHH");
                          var dq = Ext.DomQuery; 
                          var xml = response.responseXML; 
                          var nodes = dq.select('part', xml,parent);  
                          Ext.Array.forEach(nodes, self.handleNode);
                         } 
                    }
    });
},