自定义 HTML - Rally TreeGrid

Question

你好，我从下面的代码中收到一个错误，不确定为什么，因为我认为我正在定义它。在向报告添加复杂性之前，我想确保我的代码正常工作。

 launch: function() {   
     this._createGrid(); 
 },

 _createGrid: function() {
     Ext.create('Rally.data.wsapi.TreeStoreBuilder').build({
         models: ['PortfolioItem/Initiative'],
         autoLoad: true,
         enableHierarchy: true
     }).then({
         success: function(store) {
             var myGrid = Ext.create('Ext.Container', {
                 items: [{
                     xtype: 'rallytreegrid',
                     columnCfgs: ['Name', 'Owner'],
                     store: store
                 }],
                 renderTo: Ext.getBody()
             });
        }
    });
    this.add(myGrid);
},

});

"Error: success callback for Deferred transformed result of Deferred transformed result of Deferred threw: ReferenceError: myGrid is not defined"

我是新手，如有任何帮助，我们将不胜感激！

Answer 1

您在 success 函数范围内定义 myGrid，然后尝试在 _createGrid 函数的末尾使用它，即 undefined .我假设您正在尝试这样做，因为 this 未在 success 函数内正确绑定。试试这个：

_createGrid: function() {
     var self = this;
     Ext.create('Rally.data.wsapi.TreeStoreBuilder').build({
         models: ['PortfolioItem/Initiative'],
         autoLoad: true,
         enableHierarchy: true
     }).then({
         success: function(store) {
             var myGrid = Ext.create('Ext.Container', {
                 items: [{
                     xtype: 'rallytreegrid',
                     columnCfgs: ['Name', 'Owner'],
                     store: store
                 }],
                 renderTo: Ext.getBody()
             });
             self.add(myGrid);
        }
    });
},

Answer 2

您运行遇到的问题可能是由于对组件和容器在 ExtJS 中的行为方式的一些混淆以及上述答案中提到的 this 范围问题造成的。

我会这样写：

_createGrid: function() {
    Ext.create('Rally.data.wsapi.TreeStoreBuilder').build({
        models: ['PortfolioItem/Initiative'],
        autoLoad: true,
        enableHierarchy: true
    }).then({
        success: function(store) {
            //The app class is already a container, so you can just
            //directly add the grid to it
            this.add({
                xtype: 'rallytreegrid',
                itemId: 'myGrid',
                columnCfgs: ['Name', 'Owner'],
                store: store
            });
        },
        scope: this //make sure the success handler executes in correct scope
    });
}

你也不需要觉得你需要保留一个 myGrid 引用，因为你总是可以使用 ExtJS 的内置组件查询功能找到它：

var myGrid = this.down('#myGrid');

自定义 HTML - Rally TreeGrid

Custom HTML - Rally TreeGrid

javascript

rally