開始用mui移動端項目,最常遇到的問題就是刷新頁面,最多見的一種就是下拉刷新,按照官網上的來,能夠輕鬆解決;另一種常見的就是從子頁面回到父頁面的刷新,
在子頁面,註冊beforeback參數+自定義事件:web
mui.init({ beforeback: function(){ //得到列表界面的webview //var list = plus.webview.currentWebview().opener(); //目標頁面 var list = plus.webview.getWebviewById('FollowUpHisList'); //觸發列表界面的自定義事件(refresh),從而進行數據刷新 mui.fire(list, 'refresh'); //返回true,繼續頁面關閉邏輯 return true; } });
beforeback的執行返回必須是同步的,固然也能夠自定義業務邏輯,複寫mui.backui
var old_back = mui.back; mui.back = function(){ var btn = ["肯定","取消"]; mui.confirm('確認關閉當前窗口?','Hello MUI',btn,function(e){ if(e.index==0){ //執行mui封裝好的窗口關閉邏輯; old_back(); } }); }
而父頁面,則須要添加監聽事件,經過reload刷新整個頁面:code
window.addEventListener('refresh', function(e) { //在父頁面中添加監聽事件,刷新頁面 location.reload(); });
在實際應用中,若是父頁面只是單純的列表頁,那麼reload()刷新也是能夠的,但若是頁面中有其餘的請求,這時候reload()刷新整個頁面就顯得有些多餘,這個時候爲什麼不僅僅只刷新指定的方法呢?事件
window.addEventListener('refresh', function(e) { document.getElementById('infoList0').innerHTML = ""; //清空列表內容 initCloumnData();//從新加載要刷新的方法 });
固然,這種在子頁面添加自定義事件,父頁面添加監聽的方法也能夠用於方法請求成功後,自動跳轉到目標頁面並刷新,在實際中也是很實用的,尤爲是添加,編輯信息成功後,自動返回並刷新頁面。
高手請多指點,新手能夠借鑑。webview