Extjs4---Cannot read property 'addCls' of null
阿新 • • 發佈:2017-06-17
ref 一次 fine this lpar 引用 fun all ane
改動正確代碼:
用Extjs4 MVC做後臺管理系統時,通過點擊左邊導航菜單往tabpanel加入tab,然後關閉再打開某個tab,結果tabpanel不能顯示tab,系統頁面處於崩潰狀態。而且瀏覽器報錯Cannot read property ‘addCls‘ of null。
經分析查閱網上資料得知,原因是:定義grid的時候加入序號這行代碼:new Ext.grid.RowNumberer()引起的。
假設沒有這樣代碼,系統執行正常。
當用Extjs創建(create)一個window。panel時。或者就是new一個RowNumberer這種組件,當window關閉時,它會把自己內部包括的組件也destroy掉。這樣你第二次
create 這個window的時候,內部引用的那個組件已經被銷毀了,就錯誤產生了。
但假設是通過{xtype:‘xxx‘}這樣的形式獲得組件,那麽每一次 create 都會又一次創建內部組件,就不會產生錯誤。
所以建議是內部 items 裏保持{xtype:‘xxx‘}形式定義子組件。可是這個gird序號功能臨時沒有{xtype:‘xxx‘}這樣的方式獲取組件,僅僅能是通過create去創建出來。
出錯誤代碼:
Ext.define(‘WEB.view.stage.slide.SlideGridView‘, { extend:‘Ext.grid.Panel‘, alias:‘widget.slideGridView‘, stripeRows:true, loadMask:true, selType: ‘checkboxmodel‘, columnLines: true, store: ‘SlideStore‘, columns:[ Ext.create(‘Ext.grid.RowNumberer‘, { text: ‘序號‘, width : 40, align:‘center‘ }), {sortable:false, width:250, align:‘left‘,dataIndex:‘bgImgUrl‘,text:‘背景圖片‘}, {sortable:false, width:250, align:‘left‘,dataIndex:‘desImgUrl‘,text:‘描寫敘述圖片‘}, {sortable:false, flex:1, align:‘left‘,dataIndex:‘slideHref‘,text:‘滑動鏈接‘}, {dataIndex:‘slideId‘,text:‘滑動ID‘,hidden:true}, ], dockedItems: [{ xtype: ‘pagingtoolbar‘, store: ‘SlideStore‘, dock:"bottom", enableOverflow:true, displayInfo: true, emptyMsg: ‘沒有數據‘, displayMsg: ‘當前顯示{0}-{1}條記錄 / 共{2}條記錄 ‘, beforePageText: ‘第‘, afterPageText: ‘頁/共{0}頁‘ }] });
Ext.define(‘WEB.view.stage.slide.SlideGridView‘, { extend:‘Ext.grid.Panel‘, alias:‘widget.slideGridView‘, initComponent:function(){ Ext.apply(this,{ stripeRows:true, loadMask:true, selType: ‘checkboxmodel‘, columnLines: true, store: ‘SlideStore‘, columns:[ Ext.create(‘Ext.grid.RowNumberer‘, { text: ‘序號‘, width : 40, align:‘center‘ }), {sortable:false, width:250, align:‘left‘,dataIndex:‘bgImgUrl‘,text:‘背景圖片‘}, {sortable:false, width:250, align:‘left‘,dataIndex:‘desImgUrl‘,text:‘描寫敘述圖片‘}, {sortable:false, flex:1, align:‘left‘,dataIndex:‘slideHref‘,text:‘滑動鏈接‘}, {dataIndex:‘slideId‘,text:‘滑動ID‘,hidden:true}, ], dockedItems: [{ xtype: ‘pagingtoolbar‘, store: ‘SlideStore‘, dock:"bottom", enableOverflow:true, displayInfo: true, emptyMsg: ‘沒有數據‘, displayMsg: ‘當前顯示{0}-{1}條記錄 / 共{2}條記錄 ‘, beforePageText: ‘第‘, afterPageText: ‘頁/共{0}頁‘ }] }); this.callParent(arguments); } });
所以全部的屬性的設置都要用apply方法設置進去,假設沒有放到apply裏面就會報:Uncaught TypeError: Cannot read property ‘parentNode‘ of undefined 錯誤。
Extjs4---Cannot read property 'addCls' of null