Extjs4---Cannot read property 'addCls' of null 或者 el is null 关于tab关闭后再打开不显示或者报错

时间:2022-05-03
本文章向大家介绍Extjs4---Cannot read property 'addCls' of null 或者 el is null 关于tab关闭后再打开不显示或者报错,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

做后台管理系统时遇到的问题,关于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方法设置进去,nnd,这个问题整了两天,终于解决了