Extjs框架前端開發(fā)培訓

1、1Extjs框架前端開發(fā)培訓2015年11月2日Gavin2 前端基類介紹前端框架整體介紹12注意事項及建議3溝通與討論43 前端框架整體介紹技術框架： ExtJs 5.1 版本， MVVM 技術 框架結構： Common-web 所有子應用通用的前端資源 app 基類源碼 belle-ux 開發(fā)的通用控件及通用函數(shù) ext-ux 需要引用的第三方插件 static 中包括 字體圖標，Extjs框架 ，通用圖片及css樣 式文件等。 uc-web 為主框架入口，包括集成管理 。 應用中的目錄結構, model, store, controller, view 每個模塊應由4個文件組成： mod

2、el view viewController viewModel 4 前端基類介紹前端框架整體介紹12注意事項及建議3溝通與討論45 前端基類介紹BasePage 基礎基類SimplePage 單表基類MultiPage 多表基類基類的繼承關系BillList 單據(jù)清單基類BillDetail 單據(jù)明細基類單據(jù)基類6 前端基類介紹BasePage基類功能點： 1. 權限控制權限控制2. 通用方法封裝通用方法封裝3. 統(tǒng)一調(diào)用后端接口處理統(tǒng)一調(diào)用后端接口處理7 前端基類介紹SimplePage基類功能點： 1. 定義通用工具條定義通用工具條2. 定義通用查詢面板定義通用查詢面板3. 定義通用網(wǎng)格

3、定義通用網(wǎng)格mastergrid4. 定義通用編輯面板定義通用編輯面板5. 實現(xiàn)工具條中按鈕事件實現(xiàn)工具條中按鈕事件6. 控制網(wǎng)格的常用事件控制網(wǎng)格的常用事件8 前端基類介紹MultiPage基類功能點： 1. 定義定義 grid1grid9 控件控件2. 控制控制9個網(wǎng)格的常用事件個網(wǎng)格的常用事件3. 實現(xiàn)主從表（包括一主多從）的批量處理。實現(xiàn)主從表（包括一主多從）的批量處理。4. 實現(xiàn)多表（沒有主從關系）的顯示實現(xiàn)多表（沒有主從關系）的顯示9 前端基類介紹BillListPage基類功能點： 1. 實現(xiàn)跳轉到明細實現(xiàn)跳轉到明細BillDetailPage基類功能點： 1. 定義單據(jù)工具條定

4、義單據(jù)工具條 2. 定義單據(jù)面板定義單據(jù)面板 3. 定義單據(jù)狀態(tài)條定義單據(jù)狀態(tài)條 4. 實現(xiàn)單據(jù)功能實現(xiàn)單據(jù)功能 按鈕的事件按鈕的事件10 前端基類介紹前端框架整體介紹12注意事項及建議3溝通與討論411 注意事項及建議 1. 仔細檢查代碼，在本地測試成功后再提交到倉庫仔細檢查代碼，在本地測試成功后再提交到倉庫 2. 做好代碼格式化做好代碼格式化 3. 逗號和分號的用法逗號和分號的用法 4. 不要給對象添加無用的屬性不要給對象添加無用的屬性 5. 自定義布局自定義布局 6. 按基類的設計方式去實現(xiàn)模塊的開發(fā)，不要去更改基類按基類的設計方式去實現(xiàn)模塊的開發(fā)，不要去更改基類 中對象的定義，如有特殊的需求，請?zhí)岢鰜恚{(diào)整基類。中對象的定義，如有特殊的需求，請?zhí)岢鰜?，調(diào)整基類。 7. 基類的源碼都是可以看到的，多花時間去了解才能基類的源碼都是可以看到的，多花時間去了解才能