Extjs4---Cannot read property 'addCls' of null

做后台管理系统时遇到的问题，关于tab关闭后再打开不显示，或者报错

我在新的tabpanel中加入了一个grid，当我关闭再次打开就会报错Cannot read property 'addCls' of null，

原因是我在定义grid的错误

这是错误代码：

 Ext.define('HT.view.Grid',{
     extend:'Ext.grid.Panel',

     title : '人员列表',
     width:400,
     height:170,
     frame:true,
     store: {
         fields: ['id','name','sex','age','birthday'],
         proxy: {
             type: 'ajax',
             url : 'users',
             reader: {
                 type: 'json',//Ext.data.reader.Json解析器
                 root: 'users'
             }
         },
         autoLoad: true
     },
     columns: [//配置表格列
         new Ext.grid.RowNumberer(),//表格行号组件
         {header: "编号", width: 80, dataIndex: 'id', sortable: true},
         {header: "姓名", width: 80, dataIndex: 'name', sortable: true},
         {header: "年龄", width: 80, dataIndex: 'age', sortable: true},
         {header: "性别", width: 80, dataIndex: 'sex', sortable: true},
         {header: "生日", width: 80, dataIndex: 'birthdate', sortable: true}
     ]

 });

应该改为这个：

 Ext.define('HT.view.Grid',{
     extend:'Ext.grid.Panel',
     title : '人员列表',

     initComponent:function(){
         Ext.apply(this,{
             width:400,
             height:170,
             frame:true,
             store: {
                 fields: ['id','name','sex','age','birthday'],
                 proxy: {
                     type: 'ajax',
                     url : 'users',
                     reader: {
                         type: 'json',//Ext.data.reader.Json解析器
                         root: 'users'
                     }
                 },
                 autoLoad: true
             },
             columns: [//配置表格列
                 new Ext.grid.RowNumberer(),//表格行号组件
                 {header: "编号", width: 80, dataIndex: 'id', sortable: true},
                 {header: "姓名", width: 80, dataIndex: 'name', sortable: true},
                 {header: "年龄", width: 80, dataIndex: 'age', sortable: true},
                 {header: "性别", width: 80, dataIndex: 'sex', sortable: true},
                 {header: "生日", width: 80, dataIndex: 'birthdate', sortable: true}
             ]
         }),
         this.callParent(arguments);
     }

 });

看样子属性的设置都要用apply方法设置进去

http://www.jishu521.com/post/menogxinjinglong/8110408.html

=================================================================================================

之前的理解肤浅

Cannot read property 'addCls' of null 

一般出现在这种场景下

create a window ,window的 Ext.define 时的 items 你写的是 Ext.create出来的某个组件，而不是{xtype:'xxx'}这种形式

当window关闭时，它会把把自己内部包含的组件也destroy掉，这样你第二次 create 这个window的时候 内部 引用的那个组件已经被销毁了，就错误产生了。

但是你如果是{xtype:'xxx'}这种形式的话 那么 每一次 create 都会重新创建内部组件。

所以 建议是 内部 items 里 保持{xtype:'xxx'}形式定义子组件