ExtJS 5第一步，無法看到一個商店的簡單網格

我想熟悉分機JS 5.我把sencha生成的應用程序作爲的起點，並將其修改爲查看一行的網格。但該頁面只是空白。請問任何人，請告訴我我做錯了什麼？我不熟悉MVVM模式，但我想學習它。ExtJS 5第一步，無法看到一個商店的簡單網格

這裏是我的文件集：

enter image description here

這裏是JS來源。

Applications.js

Ext.define('Admin.Application', { 
    extend: 'Ext.app.Application', 
    name: 'Admin' 
});

Base.js（型號爲基類）

Ext.define('Admin.model.Base', { 
    extend: 'Ext.data.Model', 
    schema: { 
     namespace: 'Admin.model' 
    } 
});

Item.js（一個簡單的模型）

Ext.define('Admin.model.Item', { 
    extend: 'Admin.model.Base', 

    fields: [ 
     { name: 'id', type: 'int' }, 
     { name: 'title', type: 'string' } 
    ] 
});

ItemList.js（一我想要在網格中顯示的商品的商店）

Ext.define('Admin.store.ItemList', { 
    extend: 'Ext.data.Store', 

    alias: 'store.itemlist', 
    model: 'Admin.model.Item', 
    data: [{id: 1, title: 'title1'}] 
});

個

ItemListGrid.js（與柵格板）

Ext.define('Admin.view.main.ItemListGrid', { 
    extend: 'Ext.grid.Panel', 

    requires: [ 
     'Admin.store.ItemList' 
    ], 

    alias: 'widget.itemlistgrid', 

    bind: { 
     store: '{itemlist}', 

     title: '<b>Some title</b>', 

     columns: [{ 
      text: 'id', 
      dataIndex: 'id' 
     },{ 
      text: 'title', 
      dataIndex: 'title' 
     }] 
    } 
});

Main.js

Ext.define('Admin.view.main.Main', { 
    extend: 'Ext.container.Container', 
    requires: [ 
     'Admin.view.main.MainController', 
     'Admin.view.main.MainModel', 
     'Admin.view.main.ItemListGrid' 
    ], 

    xtype: 'app-main', 

    controller: 'main', 
    viewModel: { 
     type: 'main' 
    }, 

    layout: { 
     type: 'border' 
    }, 

    items: [{ 
     xtype: 'panel', 
     //region: 'west', 
     width: '100%', 
     items: [{ 
      xtype: 'itemlistgrid' 
     }] 
    }] 
});

MainController.js

Ext.define('Admin.view.main.MainController', { 
    extend: 'Ext.app.ViewController', 
    alias: 'controller.main' 
});

MainModel.js

Ext.define('Admin.view.main.MainModel', { 
    extend: 'Ext.app.ViewModel', 

    alias: 'viewmodel.main', 

    data: { 
     name: 'Admin' 
    }, 

    bind: { 
     store: '{itemlist}' 
    } 
});

該sencha app build構建應用程序沒有錯誤。但我沒有看到網格。在此之前，我嘗試了默認生成的應用程序，它顯示在我的瀏覽器中。

謝謝。

來源

2015-04-01 Grigory

ExtJS 5第一步，無法看到一個商店的簡單網格

回答

相關問題