工作中有个需求是小程序的网页在关闭的时候,需要回传给小程序一个参数

查阅小程序官方文档,有这样一个接口 wx.miniProgram.postMessage ,可以用来从网页向小程序发送消息,然后通过 bindmessage 事件来监听消息,如下是官方文档描述



微信小程序相关文章

以下是代码:


// 网页代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>postMessage</title>
</head> <body>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script type="text/javascript">
wx.miniProgram.postMessage({ data: '获取成功' }) wx.miniProgram.navigateBack({delta: 1})
</script>
</body>
</html>

// 小程序代码
<web-view bindmessage="handleGetMessage" src="test.html"></web-view> Page({
handleGetMessage: function(e) {
console.log(e.target.data)
}
})

写完试了下,期待打印 “获取成功” ,而实际小程序里面啥也没打印。。。

然后仔细看官方文档,发现有这句话:

网页向小程序 postMessage 时,会在特定时机(小程序后退、组件销毁、分享)触发并收到消息。

也就是只有在小程序后退、组件销毁、分享时才会触发

所以应该改变 postMessage 的时机,调换顺序就可以了


<script type="text/javascript">
wx.miniProgram.navigateBack({delta: 1}) wx.miniProgram.postMessage({ data: '获取成功' })
</script>

这样再试试,发现能正常捕获消息了

原文地址:https://segmentfault.com/a/1190000016717727

微信小程序的坑之wx.miniProgram.postMessage的更多相关文章

  1. 微信小程序踩坑之一[wx.request]请求模式

    最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.req ...

  2. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  3. 微信小程序数据请求方法wx.request小测试

    微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...

  4. 微信小程序wepy开发循环wx:for需要注意

    微信小程序wepy开发循环wx:for需要注意 item index值必须在wx:for之后使用 <view wx:for="{{tablist}}" class=" ...

  5. 两百条微信小程序跳坑指南(不定时更新)

    微信小程序联盟出品 跳坑textarea<二百二十三>不显示文本及textarea相关问题集合跳坑<二百一十三> background-image无法获取本地资源图片....跳 ...

  6. 微信小程序爬坑日记

    新公司上手小程序.30天,从入门到现在,还没放弃... 虽然小程序发布出来快一年了,爬坑的兄弟们大多把坑都踩平了.而我一直停留在"Hello World"的学习阶段.一来没项目,只 ...

  7. 微信小程序入坑之自定义组件

    前言 最近接触微信小程序,再次之前公司用的前端框架是vue ,然后对比发现,开发小程序是各种限制,对于开发者非常不友好.各种槽点太多,完全吐槽不过来,所以在此不多说,打算下次专门写一篇文章吐槽一下.本 ...

  8. 使用wepy框架搭建微信小程序采坑记(一)

    1.什么是wepy 这个框架是腾讯内部出的一个类MVVM的小程序开发框架.大体上来说语法是类VUE的,所以如果有VUE开发经验的话迁移成本会低一些.至于具体的怎么使用我就不赘言了,有问题查文档(官方文 ...

  9. 微信小程序的坑(持续更新中)

    参与微信小程序开发有一段时间了,先后完成信息查询类和交易类的两个不同性质的小程序产品的开发:期间遇到各种各样的小程序开发的坑,有的是小程序基础功能不断改进完善而需要业务持续的适配,有的是小程序使用上的 ...

随机推荐

  1. iOS 上传的图片在HTML上显示时,图片方向信息(EXIF Orientation)异常

    将iPhone 6s拍摄的照片上传到服务器之后, 在Web网页上看到图片被逆时针旋转了90度, 这让我很惆怅呐! 出现这个问题其实是因为上传的图片为.jpg格式,.jpg文件含有EXIF信息, 其中E ...

  2. 为什么wait,notify和notifyAll要与synchronized一起使用?

    https://blog.csdn.net/qq_39907763/article/details/79301813 Object.wait(),Object.notify(),Object.noti ...

  3. Python函数和面向对象题目

  4. Almost Acyclic Graph Codeforces - 915D

    以前做过的题都不会了.... 此题做法:优化的暴力 有一个显然的暴力:枚举每一条边试着删掉 注意到题目要求使得图无环,那么找出图上任意一个环,都应当要在其某一处断开(当然没有环是YES) 因此找出图中 ...

  5. Codeforces Round #321 (Div. 2)

    水 A - Kefa and First Steps /************************************************ * Author :Running_Time ...

  6. zabbix 安装小结

    其实很简单的东西,结果折腾了好久.首先去官网 下个source,然后按照文档来 https://www.zabbix.com/documentation/3.2/manual/installation ...

  7. laravel 权限管理 常用命令

    use Spatie\Permission\Models\Role;use Spatie\Permission\Models\Permission; $role = Role::create(['na ...

  8. Android设计模式——MVP

    一.什么是MVP MVP:全称 Model-View-Presenter. MVP框架由3部分组成:View层负责显示,Presenter层负责逻辑处理,Model层提供数据. View:负责绘制UI ...

  9. Java-学完一个月总结(javaSe学习路线)

    JavaSe的一个月 第一周 0410 基本数据类型:数据类型的转换:运算符:导入删除项目0411 分支结构if else:switch case ;while0412 do while ;for / ...

  10. scala 通过jdbc访问mysql

    scala是jvm语言,运行在jvm之上 我们知道jdbc是java访问数据库的技术,那么scala能不能通过jdbc操作数据库呢,答案是可以的 部分代码如下: /** * 获取连接 */ priva ...