7、敏捷開發框架 Tab組件的應用 Tab頁面開發（兩種使用方式）

不少狀況下，咱們須要用到Tab 選項卡的狀況

例以下面

註冊審批頁面

這個場景是，註冊審批，包含兩部分，一個是對註冊組織機構的審批，一個是註冊用戶的審批
那麼這個須要用個Tab選項卡來實現比較合適，而不是弄兩個功能菜單

那這個頁面怎麼實現呢。

關於Tab的使用，咱們有兩種模式。

第一種模式：Tab只是一個管理容器，管理不少Tab選項卡，每一個選項卡都是一個獨立的頁面。

第二種模式：Tab頁面是一個總體，裏面的Tab是這個頁面的不一樣部分

 

先來介紹第一種：

就看上面截圖的這個 註冊審批功能

 

代碼就如上，敏捷開發框架 設計了 EciTab組件

 

變化的需求來了，若是但願第二個Tab默認選中怎麼辦

 

 

 

注意，除了顯示的頁面使用url 其它的頁面建議都用 lazyUrl來實現

這樣能夠實現不不要的加載不加載

 

url  lazyUrl的設置 能夠設計時在 DOM中維護

也能夠經過 編程方式設置

 

tab.loadUrl(id,url)

tab.lazyUrl(id,url)

 

具體到子頁面裏的功能就不介紹了，都以前介紹的簡單查詢頁面模型的開發

 

第二種模式：Tab頁面是一個總體，裏面的Tab是這個頁面的不一樣部分

 

 

 

兩種模式怎麼選擇。

例如上例

基本屬性、擴展屬性，經過不一樣的分類，將頁面的字段項進行歸類整理

可是保存是要一塊兒保存的，這個時候，若是每一個Tab作成不一樣的頁面，功能就沒法實現了。

 

經過這個實際場景的例子，你們應該大致知道什麼狀況下用什麼樣的模式了。