javascript - GridPanel 作为 tabPanel 的项目

Question

我无法确定我的语法设置是否正确。来自另一个thread ，我明白要将 GridPanel 添加到 tabBar 项目，我在下面这样做。在我的 App.js 中，我定义了一个从 ExtJS 示例 (here) 复制的网格。

var grid = new Ext.grid.GridPanel({
    // Details can be seen at
    // http://dev.sencha.com/deploy/ext-3.4.0/docs/?class=Ext.Component?class=Ext.grid.GridPanel
});

在此之下，我创建了我的应用实例:

appname.App = Ext.extend(Ext.TabPanel, {

fullscreen: true,

tabBar: {
    ui: 'gray',
    dock: 'bottom',
    layout: { pack: 'center' }
},

cardSwitchAnimation: false,

initComponent: function() {

    if (navigator.onLine) {

        // Add items to the tabPanel
        this.items = [{
            title: 'Tab 1',
            iconCls: 'tab1',
            xtype: 'tab1',
            pages: this.accountPages
        }, {
            title: 'Tab 2',
            iconCls: 'tab2',
            xtype: 'tab2',
            pages: this.accountPages
        },
        grid];
    } else {
        this.on('render', function(){
            this.el.mask('No internet connection.');
        }, this);
    }

    appname.App.superclass.initComponent.call(this);
}

});

该应用程序通常加载得很好，但随着 grid 的添加，它中断了并且没有任何加载。

在句法上，我应该像 A) grid: ...、B) this.grid = new ... 或 C 这样在应用程序实例化中定义网格吗？ ) 因为我将它作为一个名为 grid 的常规 var?

非常感谢。

Answer 1

Sencha Touch 没有内置的 GridPanel。因此，Ext.grid.GridPanel 在这里不起作用。但是，您可以使用来自 here 的 Simoen 的 TouchGrid 扩展。 .

所有源代码都可用here .