Mui筆記

1、注意事項

1.固定欄靠前，帶有.mui-bar屬性的節點,固定欄都是基於fixed定位的元素；常見組件包括：頂部導航欄（.mui-bar-nav）、底部工具條(.mui-bar-footer)、底部選項卡（.mui-bar-tab），固定欄要放在.mui-content元素以前。

2.除固定欄以外的一切內容都要包括在.mui-content元素中，不然就會被固定欄遮罩。防止.mui-content被固定欄遮擋，須要定義css代碼：

.mui-bar-nav~.mui-content{padding-top:44px;}

.mui-bar-footer~.mui-content{padding-bottom:44px;}

.mui-bar-tab~.mui-content{padding-bottom:50px;}

3.始終爲button按鈕添加type屬性，默認type=submit邏輯處理，這樣若將沒有type的button放在form表單中，點擊按鈕就會執行form表單提交，頁面就會刷新，用戶體驗極差。

2、窗口管理

1.頁面初始化：必須執行mui.init方法;由於mui在頁面初始化時，初始化了不少參數配置（按鍵監聽、手勢監聽等）。

2.頁面跳轉：拋棄href跳轉;若頁面DOM還沒有渲染完畢，頁面會先顯示空白,因此使用mui.openWindow方法打開一個新的webview，mui會自動監聽新頁面的loaded事件，加載完畢，再自動顯示新頁面，提升了用戶體驗；

3.頁面關閉：勿重複監聽backbutton；mui框架自動封裝了頁面關閉邏輯，若但願自定義返回邏輯，則須要重寫mui.back方法，切勿經過addEventListener添加backbutton監聽，由於addEventListener只會增長新的執行程序。

3、手勢操做

1.mui中的點擊事件代碼：element.addEventListener('tap',function(){//點擊響應邏輯});這樣解決了300毫秒的延時。

4、mui框架中頁面間傳值

1.頁面初始化時，經過extras配置參數，設置頁面參數，從而實現頁面間傳值；

會進行頁面初始化的狀況：

- 經過mui.openWindow()打開新頁面（若目標頁面爲已預加載成功的頁面，則在openWindow方法中傳遞的extras參數無效）；

- 經過mui.init()方法建立子頁面；

- 經過mui.init()方法預加載頁面；

- 經過mui.preload()方法預加載頁面

2.頁面已建立，經過自定義事件傳值。