最近在优化自己用mui开发的app,主要还是针对交互这块儿,这里简单给大家说一下问题点场景,就是我是通过动态添加底部tabBar的方法创建了一个底部可以切换的操作区域,代码如下:

mui.init();
var defaultpage = "tab-webview-subpage-product.html"; // 定义默认选项卡子页面
var newPage = '';
// 定义所有子页面
var subpages = ['tab-webview-subpage-product.html', 'tab-webview-subpage-shopping.html',
'tab-webview-subpage-me.html'
];
// 页面加载完成后加载子页面
mui.plusReady(function() {
var current = plus.webview.currentWebview(); //获取当前页面的窗口对象
// 加载所有子页面
for (let i = 0; i < 3; i++) {
var sub = plus.webview.create(subpages[i],subpages[i], {
top: '0px',
bottom: '50px'
}
);
// 除默认页面外,其他子页面隐藏
if (subpages[i] != defaultpage) {
sub.hide();
}
current.append(sub); // 子页面加入窗口对象
}
});
// 创建点击事件
mui("#nav-tabbar").on("tap", "a", function(e) {
newPage = this.id + ".html";
if(defaultpage == newPage) {
return;
};
plus.webview.hide(defaultpage); // 隐藏上一个子页面
plus.webview.show(this.id + ".html") // 显示当前点击页面
newPage = defaultpage = this.id + ".html"; // 记录当前点击页面
});

这种方法生成的多个html页面有一个问题,就是无法使用mui.ready或mui,plusReady来监听该页面被加载了,从而无法做一些刷新页面内容或者数据的操作,此时会想到用自定义事件mui,fire方法,但是经验证也行不通,这里的解决方法只能是在有刷新要求的页面写如下代码即可

mui.plusReady(function () {
// 每次进入到这个页面触发下面的函数

plus.webview.currentWebview().addEventListener("show",function(){

//这里定义你的处理方法

},false);

})

mui框架页面每次加载操作的更多相关文章

  1. mui框架上下拉加载

    mui框架被定位为“最接近原生体验的移动App的UI框架”. 写下mui框架中常用的两个功能,下拉刷新和上拉加载,没有后台交互,用js写假数据模拟,下面直接上代码. <!DOCTYPE html ...

  2. 页面每次加载时重新获取css文件

    <script> (function(){ var version=''; var xmlhttp; // code for IE7+, Firefox, Chrome, Opera, S ...

  3. 使用MUI框架,模拟手机端的下拉刷新,上拉加载操作。

    套用mui官方文档的一句话:“开发者只需关心业务逻辑,实现加载更多数据即可”.真的是不错的框架. 想更多的了解这个框架:http://dev.dcloud.net.cn/mui/ 那么如何实现下拉刷新 ...

  4. HBuilder mui 手机app开发 Android手机app开发 ios手机app开发 打开新页面 预加载页面 关闭页面

    创建子页面 在mobile app开发过程中,经常遇到卡头卡尾的页面,此时若使用局部滚动,在android手机上会出现滚动不流畅的问题: mui的解决思路是:将需要滚动的区域通过单独的webview实 ...

  5. 使用selenium操作ant design前端的页面,感觉页面没加载完

    因需要收集页面数据,遂准备使用selenium爬取瓦斯阅读页面, 瓦斯网站使用的是ant design,元素定位非常困难,页面元素都没有ID,现在还只是能做到操作登录,不能自动打开订阅,查询某公众号, ...

  6. 前端技术-HTML页面的加载

    HTML页面的加载 HTML页面的加载实际上是基于http过程+浏览器对数据的解析渲染. http协议的请求过程是基于TCP协议的.http是要基于TCP连接基础上,简单的说,TCP单纯建立连接,不涉 ...

  7. 关于asp.net中页面事件加载的先后顺序

    一.ASP.NET 母版页和内容页中的事件 母版页和内容页都可以包含控件的事件处理程序.对于控件而言,事件是在本地处理的,即内容页中的控件在内容页中引发事件,母版页中的控件在母版页中引发事件.控件事件 ...

  8. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  9. C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法

    C#构造方法(函数)   一.概括 1.通常创建一个对象的方法如图: 通过  Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...

随机推荐

  1. JS window对象 userAgent 返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串) 语法 navigator.userAgent

    userAgent 返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串) 语法 navigator.userAgent 几种浏览的user_agent.,像360的兼容模式用的是IE.极速模 ...

  2. 利用ARIMA算法建立短期预测模型

    周五福利日活动是电信为回馈老用户而做的活动,其主要回馈老用户的方式是让用户免费领取对应的优惠券,意在提升老用户的忠诚度和活跃度.今日,为保证仓库备货优惠券资源充足,特别是5元话费券等,需要对该类优惠券 ...

  3. 【网页布局基础】css布局学习总结

    三种定位机制 1.标准文档流:从上到下,从左到右输出文档内容 2.浮动 3.绝对定位 需要注意的是块级元素如div p ul 等 行级元素如span strong img input等 块级元素与行级 ...

  4. php 学习一 变量的定义

    //php有如下几种数据类型 // false true boolean类型 //integer int 整数 //float 浮点数就是小数 //string 字符串 //string null 空 ...

  5. spring启动异步线程

    大纲: spring启动异步线程 spring配置线程池 一.spring启动异步线程 spring启动异步线程方法就是在方法上加上注解@Async,然后启动类或配置类上加上注解@EnableAsyn ...

  6. luoguP3690 【模板】Link Cut Tree (动态树)[LCT]

    题目背景 动态树 题目描述 给定N个点以及每个点的权值,要你处理接下来的M个操作.操作有4种.操作从0到3编号.点从1到N编号. 0:后接两个整数(x,y),代表询问从x到y的路径上的点的权值的xor ...

  7. NX二次开发-自定义添加右键菜单RegisterConfigureContextMenuCallback

    首先声明这个知识我以前不知道,是夏天的时候看到别人在唐工的QQ群里问的,唐工说西门子官方有这个例子.那个时候我因为在忙其他事情,也就没去研究那个右键菜单到底是怎么做的.关于自定义添加右键菜单Regis ...

  8. STM32嵌入式开发学习笔记(二):将功能封装为库文件

    将所有的函数都堆在main.c文件里不是好的选择,庞大的代码文件会是你维护的障碍,明智的做法是,一种功能封装到一个库文件里. 库文件就是你代码开始部分写的#include<xxxx.h>里 ...

  9. delete 和 splice 删除数组中元素的区别

    delete 和 splice 删除数组中元素的区别 ` var arr1 = ["a","b","c","d"]; d ...

  10. 剑指offer——50最长不含重复字符和子字符串

    题目: 请从字符串中找出一个最长的不包含重复字符的子字符串,计算该最长子字符串的长度.假设字符串中只包含’a~z”的字符.例如,在字符串“arabcacfr"中,最长的不含重复字符的子字符串 ...