美文网首页mui 记录
MUI 预加载页面

MUI 预加载页面

作者: bianruifeng | 来源:发表于2019-07-01 20:57 被阅读0次

    MUI 预加载页面的几种方式:
    一、预加载页面mui.preload必须放在plusReady事件中

     var page = null;
                mui.plusReady(function() {
                    //预加载页面mui.preload必须放在plusReady事件中
                    page = mui.preload({
                        url: 'preload.html',
                        id: 'preload',
                        extras: {
                            name: 'durant'
                        }
                    });
                })
    

    二、可通过mui.init方法中的preloadPages参数进行配置,预加载多个页面,并配置对应页面的扩展参数,但不会返回预加载每个页面的引用(异步执行)

    mui.init({
        preloadPages: [{
            url: prelaod - page - url,
            id: preload - page - id,
           styles: {}, //窗口参数  
            extras: {
                valueArray: valueArray,
                productArray: productArray
            }, //自定义扩展参数
            subpages: [{}, {}] //预加载页面的子页面  
        }]
    });
    

    自定义扩展参数 extras:{} 的获取使用:
    在该页面(preload页面)获取方式:

    var web = plus.webview.currentWebview;
    web.valueArray
    

    三、加载子页面,通常是在原来具备【header】或者【footer】的前提下,再加载进来一个【list列表】或者【mui-content】与原页面进行合并

    subpages:[{
        id:'list',  
        url:'list.html',  
        styles:{  
            top:'45px',  
            bottom:0,  
            bounce:'vertical'  
        }  
    }]
    

    四、create一次只能预加载一个页面

    function clicklist (id) { //list点击item后的事件
        var wait = plus.nativeUI.showWaiting();//显示原生等待框
        webviewShow = plus.webview.create("show.html");//后台创建webview并打开show.html
        webviewShow.addEventListener("loaded", function() { //注册新webview的载入完成事件
            wait.close(); //新webview的载入完毕后关闭等待框
            webviewShow.show("slide-in-right",150); //把新webview窗体显示出来,显示动画效果为速度150毫秒的右侧移入动画
        }, false);
    }
    

    相关文章

      网友评论

        本文标题:MUI 预加载页面

        本文链接:https://www.haomeiwen.com/subject/zewvcctx.html