2012-10-29 69 views
0

我新的ExtJS的,我試圖按照本教程:ExtJS的4.0 MVC教程給

http://docs.sencha.com/ext-js/4-0/#!/guide/application_architecture

然而,當我得到的地方,電網實際上是想成爲可見的部分,我在Javascript控制檯中出現錯誤:「類型錯誤:名稱未定義」。

我有以下文件,

app.js:

Ext.application({ 
    name: 'AM', 

    appFolder: 'app', 
    controllers: ['Users'], 

    launch: function() { 
     Ext.create('Ext.container.Viewport', { 
      layout: 'fit', 
      items: { 
       xtype: 'userList' 
      } 
     }); 
    } 
}); 

應用程序/控制器/ Users.js

Ext.define('AM.controller.Users', { 
    extend: 'Ext.app.Controller', 
    views: [ 
     'user.List'], 

    init: function() { 
     this.control({ 
      'viewport > panel': { 
       render: this.onPanelRendered 
      } 
     }); 
    }, 

    onPanelRendered: function() { 
     console.log('This panel was rendered'); 
    } 
}); 

應用程序/視圖/用戶/ List.js

Ext.define('AM.view.user.List' ,{ 
    extend: 'Ext.grid.Panel', 
    alias : 'widget.userlist', 

    title : 'All Users', 

    initComponent: function() { 
     this.store = { 
      fields: ['name', 'email'], 
      data : [ 
       {name: 'Ed', email: '[email protected]'}, 
       {name: 'Tommy', email: '[email protected]'} 
      ] 
     }; 

     this.columns = [ 
      {header: 'Name', dataIndex: 'name', flex: 1}, 
      {header: 'Email', dataIndex: 'email', flex: 1} 
     ]; 

     this.callParent(arguments); 
    } 
}); 

當然還有Index.html

<html> 
<head> 
    <title>Hello Ext</title> 

    <link rel="stylesheet" type="text/css" href="ExtJs/ext-4.1.1a/resources/css/ext-all.css"> 
    <script type="text/javascript" src="ExtJs/ext-4.1.1a/ext-debug.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body></body> 
</html> 

感謝

回答

1

你已經改變的情況下:

xtype: 'userList' 

alias : 'widget.userlist'