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}`

})

}

}

相关推荐
西洼工作室14 小时前
UniApp云开发笔记
前端·笔记·uni-app
Martin -Tang15 小时前
uniapp 实现录音操作,长按录音,放开取消
前端·javascript·vue.js·uni-app·css3·录音
西洼工作室18 小时前
UniApp开发全攻略:从生命周期到路由传值
前端·javascript·uni-app
Martin -Tang2 天前
uniapp+vue3+ts自定义表格
javascript·vue.js·uni-app
LinMin_Rik3 天前
解决win11专业版HbuilderX编译vue3的uniappX失败问题
uni-app
游戏开发爱好者83 天前
iOS应用性能监控:Pre-Main与Main函数耗时分析及Time Profiler使用教程
android·ios·小程序·https·uni-app·iphone·webview
西洼工作室3 天前
个人开发者接入阿里云号码认证服务AliCloud-NirvanaPns实现一键登录
python·阿里云·uni-app·全栈·认证授权
2501_916008894 天前
ChatGPT前端开发学习指南:Visual Studio Code与谷歌浏览器安装配置详解
ide·vscode·ios·小程序·uni-app·编辑器·iphone
2501_915909064 天前
完整指南:如何将iOS应用上架到App Store
android·ios·小程序·https·uni-app·iphone·webview
xiangxiongfly9155 天前
uni-app 组件总结
前端·javascript·uni-app