Hbuilder--mui--webview切换子页面问题

来源：互联网发布：网络用语有哪些编辑：程序博客网时间：2024/05/20 06:55

使用Hbuilder开发一个H5的app，在主页碰到一个tab选项卡切换页面问题？

1.查看官方demo---tab-webview-main.html，给出的代码是一次性加载多个webview，点击tab选项卡时显示和隐藏webview

2.对上面1这种情况，感觉有点不符合。改动了一下，首次加载一个webview，点击时再次加载点击的webview，上代码

var subpages = ['a.html', 'b.html', 'c.html', 'd.html'];var subpage_style = {top: '45px',bottom: '51px'};var aniShow = {};mui.plusReady(function(){//从本地缓存中获取用户令牌信息，通过令牌可以获取用户信息var userToken = window.localStorage.getItem("userToken");if(userToken == null || userToken == "" || userToken.length == 0){goToLogin();}var self = plus.webview.currentWebview();  for (var i = 0; i < 1; i++) {//这里只加载第一个页面      var sub = plus.webview.create(subpages[i], subpages[i], subpage_style);      if (i > 0) {  sub.hide();      }      self.append(sub);  }});var activeTab = subpages[0];var title = getById("title"); //选项卡点击事件mui('.mui-bar-tab').on('tap', 'a', function(e) {var targetTab = this.getAttribute('href');if (targetTab == activeTab) {return;}//更换标题title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;var self = plus.webview.currentWebview();  var sub = plus.webview.create(targetTab, targetTab, subpage_style);  self.append(sub);  //隐藏当前;  //plus.webview.hide(activeTab);//这里应该是关闭页面，不知道隐藏与关闭区别有多大  plus.webview.close(activeTab);//更改当前活跃的选项卡  activeTab = targetTab; });

效果切换正常，和webview全部加载出来的效果比较时，这种一个个显示子页面的方式有一定的延时，时长倒是不长。

0 0