uni-app PC端微信小程序web-view组件@message事件不执行

uni-app PC端微信小程序web-view组件@message事件不执行

开发环境 版本号 项目创建方式
Windows Windows 10 HBuilderX
家庭中文版
HBuilderX 3.1.11
第三方开发者工具 1.05.2103200
基础库 2.16.1 
### 示例代码：


#### uniapp端：
```html
<template>
<view class="page-warp">
<web-view :src="url" [@message](/user/message)="getWebMessage"></web-view>
</view>
</template>

<script>
export default {
data() {},
methods: {
getWebMessage(e) {
console.log('h5:',e)
}
}
}
</script>

H5端：

<script type="text/javascript" src="./js/jweixin-1.6.0.js"></script>
<div class="bottom-btn" [@click](/user/click)="go_miniProgram">确定</div>
<script>
wx.miniProgram.postMessage({ data: "测试测试"})
</script>



### 操作步骤：
PC端打开小程序，点击确定按钮，执行wx.miniProgram.postMessage，传参“测试测试”。返回到小程序，web-view绑定的[@message](/user/message)="getWebMessage"，getWebMessage未执行

预期结果：

执行@message="getWebMessage"绑定的getWebMessage方法



### 实际结果：
未执行[@message](/user/message)="getWebMessage"绑定的getWebMessage方法

bug描述：

web-view组件@message事件，手机和开发工具都正常执行，PC端小程序，不执行


更多关于uni-app PC端微信小程序web-view组件@message事件不执行的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

使用原生小程序（不使用 uni-app ）测试是否正常？

更多关于uni-app PC端微信小程序web-view组件@message事件不执行的实战教程也可以访问 https://www.itying.com/category-93-b0.html


哈哈，也是不正常的

回复 FggFly: 到小程序社区反馈下（先搜下是不是其他人反馈过了）

h5是不会执行这个事件的，可以用window.postMessage来实现，小程序的话，要在返回、分享的时候才会触发 @message EventHandler 网页向应用 postMessage 时，会在特定时机（后退、组件销毁、分享）触发并收到消息。 H5 暂不支持（可以直接使用 window.postMessage https://developer.mozilla.org/zh-CN/docs/Web/API/Window/postMessage

在PC端微信小程序中，web-view组件的@message事件确实存在兼容性问题。根据微信官方文档，PC端小程序对web-view的postMessage通信支持有限，可能导致事件无法触发。

排查建议：

  1. 确认PC端微信版本是否支持该功能（建议使用最新版）
  2. 检查H5端代码执行时机，确保wx.miniProgram.postMessage在页面加载完成后调用
  3. 尝试在H5端加入延时发送：
setTimeout(() => {
 wx.miniProgram.postMessage({ data: "测试测试" })
}, 1000)
回到顶部