mui

关于MUI页面之间传值以及刷新的问题

冷暖自知 提交于 2019-12-06 08:21:40
一、页面刷新问题 1.父页面A跳转到子页面B,B页面修改数据后再跳回A页面,刷新A页面数据 (1).父页面A代码 window.addEventListener("pageflowrefresh", function (e) { location.reload(); }); (2).子页面B代码 var main = plus.webview.currentWebview().opener();//获取父页面A对象 var main = plus.webview.getWebviewById('A');//或者通过A页面id获取A页面对象 mui.fire(main, "pageflowrefresh" );//出发A页面的pageflowrefresh方法 mui.redirect('A','A.html');//跳转到A页面 二、页面间传值问题 1.从A页面传值到B页面(mui.fire()方式) (1).A页面代码 var main = plus.webview.getWebviewById('B'); mui.fire(main, "pageflowrefresh",{ id:100 }) (2).B页面代码 www.bcty365.com window.addEventListener("pageflowrefresh", function (e) { //获得事件参数

html5+ & mui框架 微信授权登录无响应,不回跳APP

跟風遠走 提交于 2019-12-06 07:57:02
微信授权登录可以调起微信,但是在微信上点击确认登陆后无响应,不跳回到APP。 问题解决方法: 1. 参考文章做排除: http://ask.dcloud.net.cn/article/309 2. 我遇到的问题是因为下图第3部的item没有修改为自己的appid。并且这个在IOS平台5+SDK技术白皮书.docx并没有提及。 3. 修改了以上item的值之后,微信授权回掉成功。 来源: oschina 链接: https://my.oschina.net/u/214583/blog/2231136

选项卡js 改变图片的路径来实现点击和未点击的不同效果

半世苍凉 提交于 2019-12-06 03:43:08
上一章我介绍了用雪碧图的图片背景定位来实现选项卡选择,但是他对于图片的大小有严格的要求,必须是显示多大,你开始就得做多大的图片,如果图片很大,又不能缩小到我们想要的大小,否则就会虚。这时用上一章的内容就不能达到我们想要的效果了。因为雪碧图不能让他缩放了,否则就影响之后的背景定位了。这时我们只有现在用一张张的图片了。 、、基本的思路就是点击这个图片,这个图片变成选中的。其他就变成没选中的。 这四个图片没有选中时tab111,tab112,tab113,tab114.(11开头) 选中就是tab221, tab22 2 , tab22 3 , tab22 4 (22开头) html的内容就是下部选项卡有四个图片加文字组成的。 <nav class="mui-bar mui-bar-tab"> <a class="mui-tab-item" href="billlist.html" > <img src="img/tab111.png"id="0"/ > <span class="mui-badge" style="position:absolute;background-color:#DD524D;color:#fff;">0</span> <span class="mui-tab-label">接单</span> </a> <a class="mui-tab-item" href=

利用Mui底部导航栏实现跳转页面

雨燕双飞 提交于 2019-12-06 03:16:46
mui底部导航栏几种页面跳转方式对比 1 问题描述 mui是一款最接近原生的框架,对于会使用的人来说十分的便捷易操作,但对于像笔者这样刚入门的小白可是十分的陌生和走了太多的弯路。 对于那些不懂的前端的人,或者是一些刚入门html的人,他们可能会认为有了框架不就很快能完成一个框架了吗?其实不是这样的,一个框架他也有自己的一些东西需要去摸索和深层次的理解。也就在这几天遇到一个关于如何流畅的跳转页面的问题,看似简单易解决,可是要较好的解决它,确实有点难度。 2 问题分析 想要进行页面跳转,一开始能想象到的很简单,mui项目是封装了原生的HTML5+的API的一个框架呀,那么h5能实现的mui框架里面一定能实现撒,于是刚开始采用了href直接跳转,显然这是不行的。不断摸索,不断地走弯路,最后终于找到了,目前对于本人来说较好地方式,也就是采用mui封装的openWindow函数。 3 解决方案 首先是简单的进行页面切换实现 以下代码是利用mui的框架打出来底部标签栏框架。 该代码块呈现在手机端的页面里,仅能支持点击时和点击后的字体和图标的换色,并不会对页面进行切换。而想要实现整个页面的切换,在这个国庆里,笔者对其进行了初步的研究。初步认为有三种实现该效果的方式。 方式一之页面切换:利用 a 标签中的 href 属性直接进行跳转 利用mui进行app开发,mui是一个基于h5+的前端框架

html5+ & mui框架 微信授权登录后跳回app无任何回调事件

泪湿孤枕 提交于 2019-12-05 11:41:08
微信授权登录可以调起微信,但是在微信上点击确认登陆后跳回app,但是之后无任何回掉事件。 问题原因: 1 因为我在集成Facebook登录的时候,在 AppDelegate.m 代码中按照FB示例,加入了如下代码: 2 以上代码会覆盖 AppDelegate.m 文件中同名的函数,造成拦截了微信授权登录的回掉事件,而并没有传给html5+的相应时间来处理。 解决方法: 1 将FB的函数和5+的同名函数合并为如下: 来源: oschina 链接: https://my.oschina.net/u/214583/blog/2231141

html5+ & mui框架 微信授权登录跳出手机号码登录方式

﹥>﹥吖頭↗ 提交于 2019-12-04 14:35:54
在HBuilder真机运行微信授权登录成功,但是使用ios离线集成后,点击微信授权登录,会跳出微信手机号码登录方式(会让你填入手机号码,然后会微信下发一条短信给你,让你点击短信的链接完成登录,实际上这个短信链接无法呼其原app) 解决方法: 1 参考文章做排查(注意所有步骤): http://ask.dcloud.net.cn/article/309 2. 如何上述核对没有任何问题,请注意 /Supporting Files/info.plist 文件中 LSApplicationQueriesSchemes 项,不可缺少如下红框里面的项目(并未确定streamapp还是hbuilder会造成影响,因为需要提交到App Store才可以验证,本地调试不会出现): 来源: oschina 链接: https://my.oschina.net/u/214583/blog/2231130

mui上拉加载更多的使用

本秂侑毒 提交于 2019-12-04 08:12:04
demo地址 我的另一博客原文链接 gitHub地址 mui框架中上拉加载的坑 1、在函数自己上拉加载行为后的回调函数 2、在mui封装的上拉加载中,点击某一项会失效。 解决方法 1、该函数是必须要写的,用来写自己的逻辑需求,但是一般情况下,需要设置显示为“加载更多”还是“没有更多数据了”。看了一些博客和官方文档,基本上都把这个设置放在了定时器中并在定时器中调用获取数据的方法(自己的业务需求)。 2、在mui封装的上拉加载中,点击某一项会失效。这个是真的很坑。就是采用事件监听的方式,阻止默认行为 示例代码 mui('选择器').on('tap','选择器',function(e){ e.preventDefault(); //自己的业务逻辑 }) 一开始我将上述代码放在了mui.plusready()函数里面,可是事件并没有触发,所以,当我将它mui.plusready()中拿出来,事件就起作用了,我并不知道这是为什么,如果你偶尔看到这篇文章,可以告诉我一下。 demo代码 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0"/>

微擎使用腾讯地图拾取坐标

巧了我就是萌 提交于 2019-12-04 06:25:58
微擎使用腾讯地图拾取坐标 注意点: 传过去的 backurl 参数中,如果有 & 要将其替换成 %26,不然返回来的结果中不能识别调转链接 参考链接 示例代码: <div class="mui-input-row"> <label for="address">地址</label> <input type="text" class="mui-input-clear" id="address" onclick="getAddress()"> </div> <script> function getAddress() { var dealerid = $("input[name='dealerid']").val(); window.location.href = "https://apis.map.qq.com/tools/locpicker?search=1&type=0&backurl=跳转的链接&key=应用的KEY&referer=应用名称"; } </script> 来源: https://www.cnblogs.com/GetcharZp/p/11837511.html

MUI框架(1)

依然范特西╮ 提交于 2019-12-03 17:55:34
MUI(Mobile User Interface)是一套基于HTML5的,遵循html5+规范的,中国团队开发的,开源的,用于手机端界面开发的一套框架。mui框架是一个可以方便开发出高性能App的框架,也是目前最接近原生App效果的框架。目前,MUI是基于H5的最方便的App开发框架之一! 官网: http://dev.dcloud.net.cn/mui/ 通过HBuilder,我们可以快速开发出H5网页,而它跑在MUI框架中的速度非常快。HBuilder内嵌了jquery、bootstrap、angular、mui等常用框架的语法提示库。 HBuilder内置HTML5+ APP开发环境,提供一套完整的移动应用开发解决方案。内置HTML5+ API语法提示,提高开发效率;集成真机运行环境,方便开发后即时在真机上查看运行效果;集成应用云端打包系统,不用部署xcode和Android sdk就可以打包应用。使开发者只需要使用HTML5、Javascript、CSS技术就可以快速开发跨平台的移动应用。 创建HelloWorld应用  “新建”->“移动App” Manifest.json文件是5+移动App的配置文件,用于指定应用的显示名称、图标、应用入口文件地址及需要使用的设备权限等信息,用户可通过HBuilder的可视化界面视图或者源码视图来配置5+移动App的信息

mui使用总结

穿精又带淫゛_ 提交于 2019-12-03 14:35:54
mui是一个高性能的HTML5开发框架,从UI到效率,都在极力追求原生体验;这个框架自身有一些规则,刚接触的同学不很熟悉,特总结本文;想了解mui更详细的信息,请访问mui官网   DOM结构   关于mui页面的dom,你需要知道如下规则。   固定栏靠前   所谓的固定栏,也就是带有.mui-bar属性的节点,都是基于fixed定位的元素;常见组件包括:顶部导航栏(.mui-bar-nav)、底部工具条(.mui-bar-footer)、底部选项卡(.mui-bar-tab);这些元素使用时需遵循一个规则:放在.mui-content元素之前,即使是底部工具条和底部选项卡,也要放在.mui-content之前,否则固定栏会遮住部分主内容; ### 一切内容都要包裹在mui-content中 除了固定栏之外,其它内容都要包裹在.mui-content中,否则就有可能被固定栏遮罩,原因:固定栏基于Fixed定位,不受流式布局限制,普通内容依然会从top:0的位置开始布局,这样就会被固定栏遮罩,mui为了解决这个问题,定义了如下css代码:      [css] view plain copy.mui-bar-nav ~ .mui-content { padding-top: 44px; } .mui-bar-footer ~ .mui-content { padding