h5和小程序通信

相信大部分人可能都会遇到要在微信小程序里面嵌入h5,这个时候h5和小程序之间的通信就成了不可避免的一环,不用紧张,其实很简单。

看一下微信小程序官方文档怎么说

首先我们按照文档上的指示,在需要向小程序传递参数的页面引入 jweixin-1.3.2.js

html 复制代码
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

接下来在需要传参的js里面直接使用

javascript 复制代码
if (res.data === 200) {
    wx.miniProgram.postMessage({ data: { message: '200Hello from H5' } });
} else{
    wx.miniProgram.postMessage({ data: { message: 'Hello from H5' } });
}

最后在小程序的 handleGetMessage 方法里面接收就好啦

javascript 复制代码
  // 接收从h5传递过来的数据
  handleGetMessage: function(e) {
    console.log('查看h5传递过来的数据:',e.target.data)
  },

看,成功接收到啦

相关推荐
汤姆yu12 小时前
基于微信小程序的驾校预约与学习系统
学习·小程序·驾校预约
speedoooo14 小时前
未来的App不再需要菜单栏?
前端·ui·容器·小程序·web app
猿究院_xyz14 小时前
微信小程序与echarts联动安卓真机测试出现黑色阴影
前端·javascript·微信小程序·小程序·echarts
说私域15 小时前
不同类型企业构建私域流量的必要性及定制开发AI智能名片商城小程序的应用
大数据·人工智能·小程序
老华带你飞16 小时前
健身房预约|基于springboot 健身房预约小程序系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·小程序
2501_9159090616 小时前
苹果应用加密方案的一种方法,在没有源码的前提下,如何处理 IPA 的安全问题
android·安全·ios·小程序·uni-app·iphone·webview
2501_9159090617 小时前
iOS 项目中常被忽略的 Bundle ID 管理问题
android·ios·小程序·https·uni-app·iphone·webview
2501_9159214317 小时前
iOS App 测试的工程化实践,多工具协同的一些尝试
android·ios·小程序·https·uni-app·iphone·webview
TE-茶叶蛋17 小时前
UnoCSS 集成指南 - 小程序适配原理
小程序
李慕婉学姐18 小时前
基于微信小程序的运动会信息管理系统k6kqgy34(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
数据库·微信小程序·小程序