【已解决】webviewObj的显示隐藏动画总出不来

正练习用mui写个简单的实例,遇到如下问题:

我在初始化启动程序时,用预加载的方式创建了1个webview父对象和4个子对象,想在切换底部导航时用动画方式切换子对象的显示,但每次都出不来动画效果(相关代码如下)。

如果不用预加载而用mui提供的openWindow是有动画的,我看它源码也是调用h5 plus的show方法。而且文档上也没说预加载的就不能有动画啊。究竟是何原因?

InitTabItems:function(){
	// 子页面的公用样式配置
	var styles={top:'44px',bottom:'50px'};
	// 预加载底部导航关联页
	this.tabItems.forEach(function(v,i){
		vm.tabItemsWebview[v]=mui.preload({
			url:'tpl/'+v+'.html',
			id:v,
			styles:styles
			// 也尝试过在这里定义动画参数,但无效
		});
		if(i>0){
			vm.tabItemsWebview[v].hide();
		}else{
			vm.tabItemsWebview[v].show();
		}
		vm.mainWebview.append(vm.tabItemsWebview[v]);
	});
},
InitTabEvent:function(){
  	// 底部导航切换事件
	mui('.mui-bar-tab').on('tap','a',function(){
		var id=this.dataset.id;
		if(vm.tabItemActive!=id){
			vm.tabItemsWebview[vm.tabItemActive].hide();
			vm.tabItemsWebview[id].show('slide-in-right',200);
			vm.tabItemActive=id;
			vm.title=this.children[this.children.length-1].innerText;
		}
  	});
}


xue5hen
浏览 2165回答 2
2回答

_1____1

...

xue5hen

经测试,问题出在第17行代码,我揣测原因是:动画效果感觉只会在子页面进入父窗口时触发,如果将子对象事先加入父对象,那么父对象中已经有了就不会触发动画而只是将父对象中已经有的页面展示出来;如果不加入,则子对象处在内存中,每次调用都是从内存中拿到父对象中,这样就触发了动画。// 将预加载的webview子对象添加到父对象中 vm.mainWebview.append(vm.tabItemsWebview[v]);不知道猜的对不对。
打开App,查看更多内容
随时随地看视频慕课网APP