详细问题描述
[内容] 页面自动创建多个webview,当点击切换的时候。。。载入的页面为空白。。。。
重现步骤
[步骤]
[结果]
[期望]
运行环境
[系统版本] 5.0
[浏览器版本]
[IDE版本] 8.1
[mui版本] 最新
附件
<div id="main">
<header class="mui-bar mui-bar-nav">
<h1 class="mui-title">{{title}}</h1>
<!--<a class="mui-icon fa fa-envelope-o mui-pull-right"></a>-->
</header>
<nav class="mui-bar mui-bar-tab">
<a v-for="(item,index) in tabbar" class="mui-tab-item" :class="{'mui-active' : index === initIndex}" :href="item.url" v-on:tap="tab(index)">
<span class="mui-icon" :class="item.icon"></span>
<span class="mui-tab-label">{{item.title}}</span>
</a>
</nav>
</div>
var app = new Vue({
el: '#main',
data: {
initIndex: 0,
title: '展望慈鑫',
activeTab: 'tab-webview-subpage-about.html',
tabbar: [
{icon:'mui-icon-home',title:'home',url: 'tab-webview-subpage-about.html'},
{icon:'mui-icon-list',title:'news',url: 'tab-webview-subpage-chat.html'},
{icon:'fa fa-wrench',title:'aaa',url: 'tab-webview-subpage-contact.html'},
{icon:'fa fa-wrench',title:'bbb',url: 'tab-webview-subpage-setting.html'},
],
subStyle: {
top: '45px',
bottom: '51px'
}
},
mounted: function() {
mui.init();
var self = this;
if(mui.os.plus){
mui.plusReady(function() {
var curWs = plus.webview.currentWebview();
for(var i=0;i < self.tabbar.length;i++){
var subUrl = self.tabbar[i].url;
var subWs = plus.webview.create(subUrl, subUrl, self.subStyle);
if(i != self.initIndex){
subWs.hide();
}
curWs.append(subWs);
}
})
}
},
methods: {
tab: function (index) {
var targetTab = this.tabbar[index].url;
this.title = this.tabbar[index].title;
//修复多次本身造成错误
if(targetTab!=this.activeTab){
// 显示目标webview
plus.webview.show(targetTab);
// 隐藏当前webview
plus.webview.hide(this.activeTab);
console.log(targetTab);
console.log(this.activeTab);
// 更改当前活跃的选项卡
this.activeTab = targetTab;
}
}
}
});
其他页面随便。。。。
[安装包]
联系方式
[QQ]
[电话]