uniapp与webview直接进行传值
<template> <view class="advertisement" style="width: 100%;"> <web-view :src="url" @message="message"></web-view> </view></template> <script>export default { data() { return { url:'/hybrid/html/local.html?data=' }; }, onLoad(data) {<br> //这里对要传入到webview中的参数进行encodeURIComponent编码否则中文乱码 this.url+=encodeURIComponent(data.data) }, mounted() {}, methods: { message(event){ console.log(event.detail.data); } }};</script> <style scoped="scoped" lang="scss">@import './advertisement.scss';</style>
H5中接收的参数:
console.log(getQuery('data')); //获取 uni-app 传来的值 //取url中的参数值 function getQuery(name) { // 正则:[找寻'&' + 'url参数名字' = '值' + '&']('&'可以不存在) let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); let r = window.location.search.substr(1).match(reg); console.log(r); if(r != null) { // 对参数值进行解码 return decodeURIComponent(r[2]); } return null; }
webview向uniapp传值:
<script> document.addEventListener('UniAppJSBridgeReady', function() { //向uniapp传值 uni.postMessage({ data: { action: 'message' } }); uni.getEnv(function(res) { console.log('当前环境:' + JSON.stringify(res)); }); });</script>
uniapp:
<template> <view class="advertisement" style="width: 100%;"> <web-view :src="url" @message="message"></web-view> </view></template>