uniapp与webview之间的传参

1、由uniapp传参到webview内的网页。

//uniapp中的页面
<template>
    <web-view :src="url"> </web-view>
</template>
<script>
export default {
  data() {
    return {
        url:"https://www.demo.com?data1=1&data2=32&data3=11"
    }
  }
}
</script>

webview中的网页以解析url的方式取出参数。

2、由webview内的网页传参到uniapp。

1）、网页中发起传参

document.addEventListener('UniAppJSBridgeReady', function() {
	uni.postMessage({
		data: {
			action: ‘xxxxx’，// 这是传的参数
		}
	});
})

2）、uniapp中接收参数

<template>
	<view>
		<web-view src="/hybrid/html/map.html" @message="message"></web-view>
	</view>
</template>

<script>
	
	var wv;//计划创建的webview
	export default {
		onReady() {
			this.initPage(); // 加载网页
		},
		methods: {
			// 从webview获取参数
			message(data){
				console.log(data.detail.data.action);
			},
			
			// 初始化网页
			initPage() {
			
				// #ifdef APP-PLUS
				
				var currentWebview = this.$scope.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效，非v3编译模式使用this.$mp.page.$getAppWebview()
				
				setTimeout(function() {
				    wv = currentWebview.children()[0]
				    wv.setStyle({top:86})
				}, 1000);
				
				// #endif
				
			},
		}
	};
</script>