mui框架页面每次加载操作
最近在优化自己用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框架页面每次加载操作的更多相关文章
- mui框架上下拉加载
mui框架被定位为“最接近原生体验的移动App的UI框架”. 写下mui框架中常用的两个功能,下拉刷新和上拉加载,没有后台交互,用js写假数据模拟,下面直接上代码. <!DOCTYPE html ...
- 页面每次加载时重新获取css文件
<script> (function(){ var version=''; var xmlhttp; // code for IE7+, Firefox, Chrome, Opera, S ...
- 使用MUI框架,模拟手机端的下拉刷新,上拉加载操作。
套用mui官方文档的一句话:“开发者只需关心业务逻辑,实现加载更多数据即可”.真的是不错的框架. 想更多的了解这个框架:http://dev.dcloud.net.cn/mui/ 那么如何实现下拉刷新 ...
- HBuilder mui 手机app开发 Android手机app开发 ios手机app开发 打开新页面 预加载页面 关闭页面
创建子页面 在mobile app开发过程中,经常遇到卡头卡尾的页面,此时若使用局部滚动,在android手机上会出现滚动不流畅的问题: mui的解决思路是:将需要滚动的区域通过单独的webview实 ...
- 使用selenium操作ant design前端的页面,感觉页面没加载完
因需要收集页面数据,遂准备使用selenium爬取瓦斯阅读页面, 瓦斯网站使用的是ant design,元素定位非常困难,页面元素都没有ID,现在还只是能做到操作登录,不能自动打开订阅,查询某公众号, ...
- 前端技术-HTML页面的加载
HTML页面的加载 HTML页面的加载实际上是基于http过程+浏览器对数据的解析渲染. http协议的请求过程是基于TCP协议的.http是要基于TCP连接基础上,简单的说,TCP单纯建立连接,不涉 ...
- 关于asp.net中页面事件加载的先后顺序
一.ASP.NET 母版页和内容页中的事件 母版页和内容页都可以包含控件的事件处理程序.对于控件而言,事件是在本地处理的,即内容页中的控件在内容页中引发事件,母版页中的控件在母版页中引发事件.控件事件 ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- C#构造方法(函数) C#方法重载 C#字段和属性 MUI实现上拉加载和下拉刷新 SVN常用功能介绍(二) SVN常用功能介绍(一) ASP.NET常用内置对象之——Server sql server——子查询 C#接口 字符串的本质 AJAX原生JavaScript写法
C#构造方法(函数) 一.概括 1.通常创建一个对象的方法如图: 通过 Student tom = new Student(); 创建tom对象,这种创建实例的形式被称为构造方法. 简述:用来初 ...
随机推荐
- log库
https://github.com/orocos-toolchain/log4cpp https://github.com/search?q=glog zlog https://github.com ...
- django里面跨域CORS的设置
安装 pip install django-cors-headers 添加应用 在settings里面配置 INSTALLED_APPS = ( ... 'corsheaders', ... ) 中间 ...
- vue全家桶(vue2.x+vue-router+axios+webpack)项目搭建
参考博客文章 博主FungLeo的Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版 注:原博主写的非常详细 本文章为根据原博主教程总结的自己的搭建流程 一.安装n ...
- vs code 自定义代码片段
1.快捷键Ctrl+Shift+P打开命令输入 snippet : (也可以点击文件=>首选项=>用户代码片段) 2.选择代码语言类型(这里以JavaScrpt为例) 3.在javascr ...
- Http2协议简介
1.概述 和http1兼容.HTTP/2 没有改动 HTTP 的应用语义. HTTP 方法.状态代码.URI 和标头字段等核心概念一如往常. 不过,HTTP/2 修改了数据格式化(分帧)以及在客户端与 ...
- 【记录】spring boot 图片上传与显示
问题:spring boot 使用的是内嵌的tomcat, 文件上传指定目录时不知道文件上传到哪个地方,不知道访问路径. //部署到服务器的tomcat上时通常使用这种方式request.getSer ...
- Android中的Handler,Looper,Message机制
Android的消息处理有三个核心类:Looper,Handler和Message.其实还有一个Message Queue(消息队列),但是MQ被封装到Looper里面了,我们不会直接与MQ打交道,因 ...
- Delphi实现提取可执行文件内部所有图标
本实例实现的功能是能够从用户选择的可执行文件(后缀名为exe)中提取所有图标并且显示在窗体上. 在窗体中添加TImage 组件.TOpenDialog组件和TButton组件,TImage组件充当显示 ...
- git_全局忽略DS_store
创建设置文件 vi ~/.gitignore_global 在文件里输入 /*.DS_Store .DS_Store 设置这个文件全局生效 git config --global core.exclu ...
- jmeter 参数化3种
一.利用函数助手获取参数值 选项->函数助手对话框 __CSVRead, __Random, 生成的函数字符串:${__Random(,,)}第一个参数为随机数的下限,第二个参数为随机数的上限, ...