uniapp(h5 app) 中 webview和h5通信

1 uniapph5 和h5页面 通信

h5

window.parent.postMessage(message, '*');

uniapph5 onload中

window.addEventListener('message', function (e) {

// 监听 message 事件

//console.log(e.origin)

console.log('收到的cocos游戏ID',e.data)

//收到cocos退出游戏返回的指令

if(e.data){

uni.navigateTo({

url:`/pages/salason/salason?id=${e.data}`

})

}

})

2 uniapp app 中 和h5通信

h5 index.html中 引入<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js">

uni.webView.postMessage({ data: { } }) 发送

uniapp app 中

<web-view :src="tlink" @message="getmessage"></web-view>

//app端接收数据

const getmessage = (e) => {

console.log('uniapp接收的数据', e.detail.data[0].name)

if(e.detail.data[0].name){

uni.navigateTo({

url:`/pages/salason/salason?id=${e.detail.data[0].name}`

})

}

}

相关推荐
xx240611 小时前
UniApp学习笔记
uni-app
七七小报15 小时前
uniapp-商城-36-shop 购物车 选好了 进行订单确认2 支付方式颜色变化和颜色滤镜filter
uni-app
lh_125415 小时前
uniapp 常用开发技巧与实战指南
uni-app
某公司摸鱼前端16 小时前
uniapp 仿企微左边公司切换页
前端·uni-app·企业微信
WKK_16 小时前
uniapp自定义封装tabbar
前端·javascript·小程序·uni-app
晨集16 小时前
Uni-App 多端电子合同开源项目介绍
java·spring boot·uni-app·电子合同
盛夏绽放20 小时前
uni-app中获取用户实时位置完整指南:解决权限报错问题
uni-app·notepad++
xixixin_20 小时前
【uniapp】vue2 搜索文字高亮显示
java·服务器·前端·uni-app·交互·文字高亮
一夜枫林1 天前
uniapp自定义拖拽排列
前端·javascript·uni-app
良艺呐^O^1 天前
uniapp实现app自动更新
开发语言·javascript·uni-app