所谓的预加载技术就是在用户尚未触发页面跳转时,提前创建目标页面,这样当用户跳转时,就可以立即进行页面切换,节省创建新页面的时间,提升app使用体验
列表页:
mui.init({
swipeBack:true, //启用右滑关闭功能
//预加载详情页
preloadPages:[{
id:'set_meal.html',
url:'set_meal.html'
}
]
});
var setMealPage = '';
mui('.big_pro').on('tap', 'li', function() {
if(this.getAttribute("data-href")!==null){
setMealPage = plus.webview.getWebviewById('set_meal.html');
var id = this.getAttribute("id");
mui.fire(setMealPage,'moreInfo',{id:id});
mui.openWindow({
id:'set_meal.html'
});
//jump(this.getAttribute("data-href"));
}
});
详情页:
- window.addEventListener('moreInfo',function(event){ var _id =
event.detail.id;
mui.post(my_url+'bike/bike_combo',{id:_id},function(data){
var len = data.data.length
var htm="";
for( var i=0;i<len;i++){
htm += '<div class="tc1" >'
htm += '<img src="'+my_photo+data.data[i].photo+'" alt="" />'
+'<p><button data-href="product_details.html?id='+data.data[i].id+'" class="but">立即下单</button></p>';
htm += '</div>';
}
document.getElementById('taocan').innerHTML = htm;
mui(".but").each(function(){
this.addEventListener("tap",function(){
if($(this).attr("data-href")!==null){
jump($(this).attr("data-href"));
}
})
}) },'json'); });
为了避免打开下一个详情页时,闪一下上一个详情页,模板在详情页返回时,会清空详情页数据
mui.back = function() {
plus.webview.currentWebview().hide("auto", 300);
}
mui.plusReady(function(){
var self = plus.webview.currentWebview();
self.addEventListener("hide",function (e) {
window.scrollTo(0, 0);//重置滚动条位置
//vm.resetData();//重置页面数据
document.getElementById("taocan").innerHTML = "";
},false);
});
多谢大佬的帮忙DCloud_MUI_CHB
大佬原文地址:http://ask.dcloud.net.cn/article/12575
MUI参考文档地址:http://dev.dcloud.net.cn/mui/event/#customevent