跨平台移动APP开发进阶三 hbuilder+mui mobile app 开发心酸路

登山则情满于山，观海则意溢于海。这篇文章主要讲述跨平台移动APP开发进阶三 hbuilder+mui mobile app 开发心酸路相关的知识，希望能为你提供帮助。
注:请点击此处进行充电！

文章图片

1.问题描述：在实现图片轮转时，若将
< script type="text/javascript">
mui("#slider").slider({
interval: 5000
});
< /script>
【跨平台移动APP开发进阶三 hbuilder+mui mobile app 开发心酸路】置于图片加载之前，图片不会显示，
解决措施：将其置于图片显示之后才会显示。

2.问题描述：

文章图片

同上面的问题，会遇到报指针为null的异常。若要获取一个组件的id，可能带获取的组件还未加载，导致获取失败。
解决措施：将获取组件id的js脚本在定义组件id之后完成。

3.问题描述：页面是由主页面加内容页面组合而成。在主页面做弹出菜单时，弹出菜单无法显示。
问题根源：内容页面遮挡了弹出菜单，致其无法显示。
解决措施：弹出层放在内容页面里，父页面通知内容页面来显示。（使用遮罩蒙版技术解决）
注：在popover、侧滑菜单等界面，经常会用到蒙版遮罩；比如popover弹出后，除popover控件外的其它区域都会遮罩一层蒙版，用户点击蒙版不会触发蒙版下方的逻辑，而会关闭popover同时关闭蒙版；再比如侧滑菜单界面，菜单划出后，除侧滑菜单之外的其它区域都会遮罩一层蒙版，用户点击蒙版会关闭侧滑菜单同时关闭蒙版。
这是一个跨webview的popover示例，在父webview中，点击后通过自定义事件通知子webview，子webview再执行popover的显示隐藏逻辑；
思想来源于Hbuilder群，启发了自己。通过HBuilder自带的示例可以很好的解决自己遇到的问题。
折腾了将近一天这个问题还是没能得到解决！弹出菜单还是被内容页面遮挡。如图一所示，其实自己是想实现图二：
疑惑：父页面如何与内容页面传递数据？

文章图片

图一

文章图片

图二

4.问题描述：一个view有诸多button，可不可以通过一个函数判断点击的是哪一个button？并获取其id
解决措施：
//on中参数的含义依次为事件、选择器、参数、方法，其中选择器与参数为可选项
mui(‘.mui-content‘).on(‘tap‘,‘body‘,function(){
alert(this.id); // (根据id判断是哪一个button)
})
总结：mui中的方法都是封装的jquery,所以自己还得从jquery着手，因为好多方法不会用，不知道参数的含义。

5.问题描述：由于index页面的顶部导航栏与分类页面的头顶部导航栏相同，header和content在不同的webview中。我想提升代码的复用性（即多个content页面均使用同一个header页面），如何解决？Mui能够做到吗？
解决措施：使用webview模式选项卡。何谓webview模式？其实就是每个选项卡内容都是一个独立的webview，彼此之间互相独立、互不影响；对于较为复杂的业务系统，推荐使用该模式。另外，基于webview模式的选项卡，支持原生加速的下拉刷新。如下图：