MUI顶部选项卡的用法详解_javascript技巧_脚本之家

来源:http://www.pykjg.com 作者:一分快三官网 人气:67 发布时间:2020-03-24
摘要:前 言 MUI是一款最相近原生应用程式体验的高质量前端框架,它的非常首要的效果与利益是:下拉刷新、侧滑导航、滑动触发操作菜单和最上部选项卡等 近几年用MUI做手提式无线电话机

前 言

MUI是一款最相近原生应用程式体验的高质量前端框架,它的非常首要的效果与利益是:下拉刷新、侧滑导航、滑动触发操作菜单和最上部选项卡等

近几年用MUI做手提式无线电话机app应用的时候,蒙受的小bug。顺便讨论了一下以此tab-top-webview-main,这里给大家大吃大喝一下。

1主页代码

     .d1{ width: 100%; height: 50px; text-align: center; line-height: 50px; background-color: #CCCCCC; }    我是div1,下面是插入的子页面     mui.init({ subpages:[{ //下边是初始化,然后这个页面显示我们将插入的页面 url:"tab-top-webview-main.html", id:"tab-top-webview-main.html", styles:{ top:"50px", bottom:"0px" } }] }) 

2子页代码

  Hello MUI         推荐   热点         mui.init(); mui.plusReady { var group = new webviewGroup("tab-top-webview-main.html", { items: [{ id: "tab-top-subpage-1.html", //这是子页1的路径 url: "tab-top-subpage-1.html", extras: {} }, { id: "tab-top-subpage-2.html", //这是子页2的路径 url: "tab-top-subpage-2.html", extras: {} }], onChange: function { var c = document.querySelector(".mui-control-item.mui-active"); if { c.classList.remove; } document.querySelector(".mui-scroll .mui-control-item:nth-child(" +  + 1) + ")").classList.add; mui.on("tap", ".mui-control-item", function { var wid = this.getAttribute; group.switchTab; mui.back = function() { var _self = plus.webview.currentWebview(); _self.close; }  

3代码解释

var group = new webviewGroup("tab-top-webview-main.html", { items: [{ id: "tab-top-subpage-1.html", //这是子页1的路径 url: "tab-top-subpage-1.html", extras: {} }, { id: "tab-top-subpage-2.html", //这是子页2的路径 url: "tab-top-subpage-2.html", extras: {} }] })

1、子页选项卡的超链接a的data-w属性供给安装为对应子页选项卡路线。

 推荐

2、这里,new webviewGroup("tab-top-webview-main.html",{}State of Qatar第一个参数需求传入一个页面包车型大巴id。要求专心的是,这一个页面id 正是大家满含顶上部分选项卡的页面,也便是当前我们这段js所在的页面

new webviewGroup("tab-top-webview-main.html", {}

3、 items数组中传唱的是子页对应选项卡该导入的子页面包车型大巴id,有多少个子页就增加多少个子页,中间用逗号分隔

我们要是还应该有别的要求,能够去MUI网址上探究扶持文书档案

总结

以上所述是小编个大家介绍的MUI最上部选项卡的用法详细明白,希望对我们享有利于,如若大家有此外疑问迎接给自家留言,小编会及时回复大家的!

本文由一分快三平台发布于一分快三官网,转载请注明出处:MUI顶部选项卡的用法详解_javascript技巧_脚本之家

关键词:

最火资讯