MUI back返回父頁面，同時刷新父頁面

Travis 發布于2019-08-21 11:42 / 1778人閱讀

開始用mui移動端項目，最常遇到的問題就是刷新頁面，最常見的一種就是下拉刷新，按照官網上的來，可以輕松解決；另外一種常見的就是從子頁面回到父頁面的刷新，
在子頁面，注冊beforeback參數+自定義事件：

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.back

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刷新整個頁面：

window.addEventListener("refresh", function(e) {
//在父頁面中添加監聽事件，刷新頁面
    location.reload();  
});

在實際應用中，如果父頁面只是單純的列表頁，那么reload()刷新也是可以的，但如果頁面中有其他的請求，這時候reload()刷新整個頁面就顯得有些多余，這個時候為何不單單只刷新指定的方法呢？

window.addEventListener("refresh", function(e) {  
    document.getElementById("infoList0").innerHTML = "";
    //清空列表內容
    initCloumnData();//重新加載要刷新的方法
});

當然，這種在子頁面添加自定義事件，父頁面添加監聽的方法也可以用于方法請求成功后，自動跳轉到目標頁面并刷新，在實際中也是很實用的，尤其是添加，編輯信息成功后，自動返回并刷新頁面。
高手請多指點，新手可以借鑒。

云服務器 GPU云服務器 html返回父級頁面父頁面 html退回父頁面 iframe調用父頁面js

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/87000.html

MUI框架開發HTML5手機APP(二)--頁面跳轉傳值&底部選項卡切換

摘要：三底部選項卡切換頁面底部選項卡的切換，可以說是的標志之一。兩種模式的顯示效果差不多，如下圖可見兩種模式的區別顧名思義，模式是將所有子頁面的內容，分別放置到主頁不同的中，當我們點擊主頁的不同選項卡時，切換不同的顯示。概述 JRedu 　　在上一篇博客中，我們學習了如何使用Hbuilder創建一個APP，同時如何使用MUI搭建屬于自己的第一款APP，沒有學習的同學可以戳鏈接學習： http...

番茄西紅柿 2019-04-23 13:37 評論0 收藏0
記微信網頁開發單頁面返回不刷新的實現

摘要：使用語法與要跳轉到的對應的狀態信息。頁面名字，方便調試。要跳轉到的地址，不能跨域，對于單頁應用來說沒用，傳空即可。需求在微信網頁開發中,點擊返回按鈕不刷新頁面,進行頁面切換,且實現傳值功能. 問題由來在做微信網頁開發時,由于微信的左上角返回按鈕會返回上一個頁面并且刷新,無法做成打開頁面選擇內容后關閉當前頁面,并且給前一個頁面傳值的功能. 實現方法想實現此功能一開始想到的是不進行...

cuieney 2019-08-22 15:39 評論0 收藏0
MUI使用總結

摘要：預加載自定義事件第三方擴展插件涉及的，除了，其它所有手機瀏覽器及瀏覽器均無法使用，目前主要包括語音輸入事件相關注意瀏覽器沒有事件事件相關的，手機端瀏覽器均可使用端模擬手機瀏覽器也可以正常使用。最近項目中需要使用MUI做一個視頻播放的小功能。我就花時間研究了一下MUI。 MUI是一個使用JavaScript開發Android和IOS應用的前端框架。這篇文章將以知識樹的形式對MUI的使用...

elliott_hu 2019-08-23 14:48 評論0 收藏0
VUE實例圖解

摘要：案例品牌列表構建基本結構利用的樣式數據要雙向更新，所以要用到，同時在后面的中要進行初始化為添加按鈕綁定事件的中，綁定值為關鍵字刪除標簽綁定函數，傳入參數的時候，需要用括號事件修飾符，表示阻止默認事件實例對象新建一個實例函數中初始化需要雙向 VUE案例品牌列表構建基本結構利用bootstrap的樣式 showImg(https://segmentfault.com/img/bVbf...

wqj97 2019-08-23 11:27 評論0 收藏0
mui實現底部凸起按鈕的實現

摘要：最近在看其他的時候，突然想到了在中自己實現一個底部凸起按鈕的效果。來實現底部切換始終處于上層的效果。最后附上本人的圓形按鈕代碼和實現效果圖。最近在看其他app的時候，突然想到了在mui中自己實現一個底部凸起按鈕的效果。大致想要實現的樣子如圖（來自閑魚app的主界面）：showImg(https://segmentfault.com/img/bVHqdd?w=276&h=122); 話...

DevTalking 2019-08-21 11:24 評論0 收藏0