关于使用mui的一点心得

最近使用mui框架开发webApp，在入坑爬坑之余也有了一点自己的心得。

1、关于打开新页面和页面之间的传参：

mui.openWindow({
url:'newPage.html',
extras:{
 //自定义扩展参数，可以用来处理页面间传值
id:id
},
show:{
autoShow:true,//页面loaded事件发生后自动显示，默认为true
aniShow:'zoom-fade-out',//页面显示动画，默认为“slide-in-right”；
duration: 100//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
}
});

到了新页面之后接收参数：

mui.plusReady(function(){
   var self = plus.webview.currentWebview();
 var id= self.id;

});

这样就会得到前一个页面传过来的参数。

2、关于mui底部选项卡。

新建的mui底部选项卡模板

var subpages = ['tab-webview-subpage-about.html', 'tab-webview-subpage-chat.html', 'tab-webview-subpage-contact.html', 'tab-webview-subpage-setting.html'];

这里面存了预加载的的页面。

<nav class="mui-bar mui-bar-tab">
<a id="defaultTab" class="mui-tab-item mui-active" href="tab-webview-subpage-about.html">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item" href="tab-webview-subpage-chat.html">
<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
<span class="mui-tab-label">消息</span>
</a>
<a class="mui-tab-item" href="tab-webview-subpage-contact.html">
<span class="mui-icon mui-icon-contact"></span>
<span class="mui-tab-label">通讯录</span>
</a>
<a class="mui-tab-item" href="tab-webview-subpage-setting.html">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">设置</span>
</a>
</nav>

这个里面的a标签链接的页面和上面数组里面的页面一一对应。

结语：作为编程界非知名程序员，我还有很长的路要走。