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

時間 2019-11-18 標籤 extjs4 extjs 4 read property addcls null

用MVC作後臺管理系統時遇到的問題，關於tab關閉後再打開不顯示，或者報錯javascript

我在新的tabpanel中加入了一個grid，當我關閉再次打開就會報錯Cannot read property 'addCls' of null，java

緣由是我在定義grid的錯誤ajax

這是錯誤代碼：json

 1 Ext.define('HT.view.Grid', {
 2     extend: 'Ext.grid.Panel',
 3 
 4     title: '人員列表',
 5     width: 400,
 6     height: 170,
 7     frame: true,
 8     store: {
 9         fields: ['id', 'name', 'sex', 'age', 'birthday'],
10         proxy: {
11             type: 'ajax',
12             url: 'users',
13             reader: {
14                 type: 'json', //Ext.data.reader.Json解析器
15                 root: 'users'
16             }
17         },
18         autoLoad: true
19     },
20     columns: [ //配置表格列
21         new Ext.grid.RowNumberer(), //表格行號組件
22         {
23             header: "編號",
24             width: 80,
25             dataIndex: 'id',
26             sortable: true
27         }, {
28             header: "姓名",
29             width: 80,
30             dataIndex: 'name',
31             sortable: true
32         }, {
33             header: "年齡",
34             width: 80,
35             dataIndex: 'age',
36             sortable: true
37         }, {
38             header: "性別",
39             width: 80,
40             dataIndex: 'sex',
41             sortable: true
42         }, {
43             header: "生日",
44             width: 80,
45             dataIndex: 'birthdate',
46             sortable: true
47         }
48     ]
49 });

應該改成這個：
app

 1 Ext.define('HT.view.Grid', {
 2     extend: 'Ext.grid.Panel',
 3     title: '人員列表',
 4 
 5     initComponent: function() {
 6         Ext.apply(this, {
 7             width: 400,
 8             height: 170,
 9             frame: true,
10             store: {
11                 fields: ['id', 'name', 'sex', 'age', 'birthday'],
12                 proxy: {
13                     type: 'ajax',
14                     url: 'users',
15                     reader: {
16                         type: 'json', //Ext.data.reader.Json解析器
17                         root: 'users'
18                     }
19                 },
20                 autoLoad: true
21             },
22             columns: [ //配置表格列
23                 new Ext.grid.RowNumberer(), //表格行號組件
24                 {
25                     header: "編號",
26                     width: 80,
27                     dataIndex: 'id',
28                     sortable: true
29                 }, {
30                     header: "姓名",
31                     width: 80,
32                     dataIndex: 'name',
33                     sortable: true
34                 }, {
35                     header: "年齡",
36                     width: 80,
37                     dataIndex: 'age',
38                     sortable: true
39                 }, {
40                     header: "性別",
41                     width: 80,
42                     dataIndex: 'sex',
43                     sortable: true
44                 }, {
45                     header: "生日",
46                     width: 80,
47                     dataIndex: 'birthdate',
48                     sortable: true
49                 }
50             ]
51         }),
52         this.callParent(arguments);
53     }
54 
55 });