+
80
-

uniapp中如何在web-view加载完成网页后再显示?

uni

uniapp中如何在web-view加载完成网页后再显示?


网友回复

+
0
-
<template>
	<view>

	</view>
</template>

<script>
	//将要创建的webview对象
	var wv;

	export default {
		data() {
			return {
				windowInfo: null
			}
		},
		props: {
			devinfo: {
				type: Object,
				default: function(){
					return {};
				}
			},
			cmuid: {
				type: Number,
				default: 0
			}
		},
		mounted() {
			uni.getSystemInfo({
			    success: (res)=> {
					this.windowInfo = res;
					//this.createWvAndLoadUrl('https://uniapp.dcloud.io/static/web-view.html');
					this.createWvAndLoadUrl('http://www.baidu.com');

			    }
			});
		},
		beforeDestroy() {
			//关闭webview对象
			if(wv){
				wv.close()
				//wv.hide()
			}
		},
		methods: {
			/*创建web-view并加载url*/
			createWvAndLoadUrl(url){
				// #ifdef APP-PLUS
				wv = plus.webview.create(url,"webview",{
					plusrequire:"none", //禁止远程网页使用plus的API,有些使用mui制作的网页可能会监听plus.key,造成关闭页面混乱,可以通过这种方式禁止
					top: this.windowInfo.statusBarHeight + 126, //放置在titleNView下方。如果还想在webview上方加个地址栏的什么的,可以继续降低TOP值
					scalable: true,
					height: this.windowInfo.windowHeight - this.windowInfo.statusBarHeight - 126
				})

				wv.addEventListener('loading', () => {
					plus.nativeUI.showWaiting()

				}, false);
				//plus.nativeUI.showWaiting()
				//this.api.showComLoading()
				wv.addEventListener('loaded', () => {
					plus.nativeUI.closeWaiting();

				}, false);

				//wv.loadURL(url)
				var currentWebview = this.$parent.$scope.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效,非v3编译模式使用this.$mp.page.$getAppWebview()
				currentWebview.append(wv);//一定要append到当前的页面里!!!才能跟随当前页面一起做动画,一起关闭
				setTimeout(function() {
					console.log(wv.getStyle())
				}, 1000);//如果是首页的onload调用时需要延时一下,二级页面无需延时,可直接获取
				// #endif 
			},

		}
	}
</script>

<style lang="scss">

</style>

我知道答案,我要回答