l***@163.com
l***@163.com
  • 发布:2017-07-18 12:35
  • 更新:2017-12-20 17:14
  • 阅读:9034

mui返回的时候刷新页面的问题

分类:MUI

例如有3个页面,a,b,c ,页面间的逻辑关系是a->b->c 和a->c ,我想在c页面点返回按钮的时候,如果返回到b页面就刷新b页面,如果返回到a页面就刷新a页面,但是现在如果我进入c页面的方式是从a到b到c,如果返回就会先回到b,然后自动回到a,无法在b页面停留;求各位大神帮我解决一下
c页面中的代码:
mui.init({
gestureConfig: {
doubletap: true
},
subpages: [{
url: 'shopCar_sup.html',
id: 'shopCar_sup',
styles: {
top: '71px',
bottom: '0px',
hardwareAccelerated: true //硬件加速
}
}],
beforeback: function() {
//获得webview
var enjoymentFruit_sub = plus.webview.getWebviewById('enjoymentFruit_sub');
var enjoymentFruit_detail = plus.webview.getWebviewById('enjoymentFruit_detail');

                    mui.fire(enjoymentFruit_sub, 'refresh');  
                    mui.fire(enjoymentFruit_detail, 'refresh');  
                    //返回true,继续页面关闭逻辑  
                    return true;  
                }  
            });  

我使用的在mui.init({});中添加beforeback属性 在beforeback属性中定义刷新事件,在他的父页面中监听刷新事件
b: var self = plus.webview.currentWebview();
window.addEventListener('refresh', function() {
console.log(111);
setTimeout(function(){
self.reload(true);
},300);
});

c: window.addEventListener('refresh', function() {
console.log(222);
thisweb.reload(true);
});

2017-07-18 12:35 负责人:无 分享
已邀请:
王者地带

王者地带 - 5+混合APP开发教程网 | http://www.html5-app.com | 咨询QQ: 2564034335

其实不用 beforeback 都可以的了
思路应该是: b>c 和 a<c , 当从b页面打开c页面时,传个值过去,告诉C页面你是从B页面过来的,

 在B页面把值传给C页面,告诉它你是从B页面过来的  
  var Cpage= plus.webview.getWebviewById('Cpage');    
   mui.fire(Cpage, 'pagetype',  
           {  
           type:"bpage"  
          });  

        C页面监听接到传来的值,  
        var pagetype;  
    window.addEventListener('pagetype', function(options)   
            {  
               pagetype=options.detail.type;  
            }, false);  

         然后C页面返回的时候判断,  
         mui.back = function()  
        {  
            if(pagetype=="bpage")  
                      {  
                            这里是从B到C页面,这里到返回B页面时刷新,再传值回去B页面告诉他要刷新  
                                   var Bpage= plus.webview.getWebviewById('Bpage');    
                                    mui.fire(Bpage, 'refresh',  
                                       {  
                                            type:"bpage"  
                                       });  

                      }  
                      else  
                       {  
                           这里是从A到C页面,这里到返回A页面时刷新,再传值回去A页面告诉他要刷新  
                                   var Apage= plus.webview.getWebviewById('Apage');    
                                    mui.fire(Apage, 'refresh',  
                                       {  
                                            type:"apage"  
                                       });  

                       }  
                     mui.back()  

        }  
l***@163.com

l***@163.com (作者)

我在a页面或者b页面用plus.webview.getWebviewById('Apage');获取页面的id值是null ,怎么办啊

  • 王者地带

    ApageID ,这是你创建A页面时填的ID , plus.webview.getWebviewById('ApageID'); ,获得不到,一是还没有创建这个页面,二是你没有等mui.plusReady 后再获得取

    2017-07-18 15:57

l***@163.com

l***@163.com (作者)

我创建了 打开的时候就创建页面 获取的时候也是在plusReady()里面获取的

l***@163.com

l***@163.com (作者)

对的 你说的对 我开始从a页面还没有点击到c页面 所以当时c页面还没有被创建
所以a页面里获取不到c页面的id 这要怎么解决啊

  • 王者地带

    你可以在A页面先预加载B,C两个页面,需要用的时候就,show 它出来

    2017-07-18 16:24

l***@163.com

l***@163.com (作者)

window.addEventListener('pagetype', function(event) {
pagetypes = event.detail.type;
console.log(pagetypes);
var old_back = mui.back;
mui.back = function() {
console.log(pagetypes);
if(pagetypes == 'enjoymentFruit_detail') {
console.log(111);
var enjoymentFruit_detail = plus.webview.getWebviewById('enjoymentFruit_detail');
mui.fire(enjoymentFruit_detail, 'refresh', {
type: "enjoymentFruit_detail"
});
} else if(pagetypes == 'enjoymentFruit_sub') {
console.log(222);
var enjoymentFruit_detail = plus.webview.getWebviewById('enjoymentFruit_sub');
mui.fire(enjoymentFruit_sub, 'refresh', {
type: "enjoymentFruit_sub"
});
}
old_back();
}
});

我点击返回按钮不走mui.back = function() {} 是怎么回事啊 我的按钮
<header class="mui-bar mui-bar-nav nav-header header_back_color">
<a href="#" class="back_btn mui-action-back header_font_color"></a>
<h1 class="navTitle header_font_color">购物车</h1>
</header>

王者地带

王者地带 - 5+混合APP开发教程网 | http://www.html5-app.com | 咨询QQ: 2564034335

mui.back = function() {}方法, 怎么能放进window.addEventListener('pagetype', function(event) {}里 执行呢, 要独立出来

l***@163.com

l***@163.com (作者)

恩恩我拿出来就好了 但是因为我在window.addEventListener({})外面拿不到我得到的值 ,我的解决办法是把pagetypes 存在了localStorage里面了 然后用的时候取出来 有啥别的好的方法吗

海带

海带

  1. 在子页面初始化时,注册beforeback方法;

复制代码
mui.init({
beforeback: function() {
     //获得父页面的webview
var list = plus.webview.currentWebview().opener();
     //触发父页面的自定义事件(refresh),从而进行刷新
mui.fire(list, 'refresh');
//返回true,继续页面关闭逻辑
return true;
}
});
复制代码
2.在父页面中添加事件监听:

window.addEventListener('refresh', function(e){//执行刷新
location.reload();
});

该问题目前已经被锁定, 无法添加新回复