升級 ExtJS 至 4.0.7 時遇到的幾個小問題

升級 ExtJS 至 4.0.7 時遇到的幾個小問題以及對應的解決方法。

1、 新的類庫體系

舊的類定義方式為：

App.view.Viewport = Ext.extend(Ext.panel.Panel, {
   initComponent: function() {
      // call parent initComponent method
      App.view.Viewport.superclass.initComponent.apply(this, arguments);
   }
});

新的類定義方式為：

Ext.define('App.view.Viewport', {
   initComponent: function() {
      // call parent 
      this.callParent(arguments);
   }
});

2、 Ext.Loader 動態加載 js 文件

4.0.7 版本的 Ext.Loader 默認是未啟用動態加載的， 導致運行時會報錯， 要手工設置啟用動態加載， 啟用動態加載的代碼為：

Ext.Loader.setConfig({  enabled: true });

Ext.Loader 還有幾個有用的參數（paths、 disableCaching）等， 可以查看相關 Ext.Loader API。

3、 Ext.panel.Panel 的 onResize 方法已經刪除

沒錯， Ext.panel.Panel 的 onResize 方法已經刪除， 重寫 onResize 方法的類需要稍微修改一下， 推薦使用 componentLayout 事件或者 afterComponentLayout 方法。

4、 Ext.panel.Panel 的 collapsible 設置為 true 時，必須設置 panel 寬度

如果沒有設置 panel 的寬度， 點擊 panel 的 collapse 工具按鈕時， 會導致整個 panel 不可見。

5、 不能手工刷新 Ext.form.ComboBox 的 store 的數據

如果用代碼刷新了 ComboBox 的 store 的數據， 會導致其彈出的選擇列表一直顯示“正在加載”， 無法進行選擇， 如果必須要刷新 store 數據， 只能改用其它的控件代替 ComboBox。