使用Ext JS，不要使用頁面作組件重用，儘可能不要作頁面跳轉

使用Ext JS，不要使用頁面作組件重用，儘可能不要作頁面跳轉

今天，有人請教我處理辦法，問題是：

一個Grid，選擇某條記錄後，單擊編輯後，彈出編輯窗口（帶編輯表單），編輯完成後單擊保存按鈕保存表單，並關閉窗口，刷新Grid。

這，原本是很簡單的，但囿於開發人員對Ext JS的理解不到位，搞得至關的複雜了。

主要複雜的地方在如下幾點：

• 爲了實現編輯表單的可重用，把表單作成了頁面，而後在Window中套IFRAME打開頁面。
• 表單的提交不是用Ajax提交，而是使用習慣的頁面跳轉方式提交，因而，一切都複雜起來了。

要這樣實現，也不是不能夠，在最後的提交頁面，調用parent對象操做父頁面的對象關閉窗口並刷新Grid。不過，這樣實在太複雜了。

這裏存在的問題是對Ext JS的開發理解不到位，仍是根據老的開發方式去來寫Ext JS的應用程序，於是原本簡單的東西一會兒就複雜化了，這也是不少初學者常常犯的錯誤。

要很好的使用Ext JS進行開發，要牢記如下幾點：

• Ext JS的數據交互，基本上是以Ajax爲工具，以JSON或XML格式數據進行交互，這個過程，不須要任何的頁面跳轉來實行，數據的處理都以一種很標準化的數據格式進行處理，如錯誤處理、成功保存等等信息，均可經過JSON或XML格式的數據來告訴客戶端，讓客戶端去進行處理。
• 使用Ext JS（尤爲是4）編寫本身的擴展，實現組件的重用，很是的方便，不須要把重用部分作成一個頁面那麼麻煩。
• 使用Ext JS 4能夠很容易實現單頁面的應用程序，也就是隻須要一個頁面就好了，客戶端與服務器端的數據交互都是遵循第一點來處理的。固然，擔憂性能問題的，也會以IFRAME形式來實現多頁面的應用程序，可是，必須明白的是，這也是以單頁面爲基礎的，意思就是，一個IFRAME頁面的流程，基本就是一個單頁面的應用程序的流程，不須要相似習慣的Web開發方式那樣進行多個頁面的控制。理解這點很重要，否則，還真不如不用Ext JS，直接使用習慣的Web開發方式來開發。
• Ext JS在客戶端也是數據與UI分離的，千萬別在UI中找數據。
• 使用Ext JS，是基於組件形式來組織UI的，而不是以HTML代碼來組織UI的，儘管最終生成的都是HTML代碼。通常狀況下，是不須要直接編寫HTML代碼就能實現應用程序的，若是確實須要使用使用HTML代碼，那就要考慮爲何要用、是否有替代辦法、怎麼用這樣問題。