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

查阅小程序官方文档,有这样一个接口 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. Python基础知识(3)

    1:字符串类型转换 num = 100 num2 = " #num是整数类型的值,num2是字符串类型的值,如果把他们两个的类型转换下呢? int(num2) #int 整形成整数 str( ...

  2. Hdu 4725 The Shortest Path in Nya Graph (spfa)

    题目链接: Hdu 4725 The Shortest Path in Nya Graph 题目描述: 有n个点,m条边,每经过路i需要wi元.并且每一个点都有自己所在的层.一个点都乡里的层需要花费c ...

  3. WOJ1109 奶牛排队

    题目链接: WOJ1109 题目描述: 奶牛在熊大妈的带领下排成了一条直队. 显然,不同的奶牛身高不一定相同-- 现在,奶牛们想知道,如果找出一些连续的奶牛,要求最左边的奶牛A是最矮的,最右边的B是最 ...

  4. Painful Bases LightOJ - 1021

    Painful Bases LightOJ - 1021 题意:给出0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F中的一些字符(不重复)还有一个进制base,求这些字符的排列形成的ba ...

  5. Lucas+中国剩余定理 HDOJ 5446 Unknown Treasure

    题目传送门 题意:很裸,就是求C (n, m) % (p1 * p2 * p3 * .... * pk) 分析:首先n,m<= 1e18, 要用到Lucas定理求大组合数取模,当然p[]的乘积& ...

  6. Linux 导出Okular 编辑的pdf批注

    1.环境 ubuntu 14.04 LTS Okular Version 0.19.3 Using KDE Development Platform 4.13.3 2.方法 2.1只导出批注,不改变p ...

  7. web 前端的一些问题

    1. HTML 和 JS 一个网页显示出来的静态的内容为html创见的静态object 对这些object的操作通过JS来响应 2. HTTP cookie cookie是由server set, 由 ...

  8. 152 Maximum Product Subarray 乘积最大子序列

    找出一个序列中乘积最大的连续子序列(该序列至少包含一个数).例如, 给定序列 [2,3,-2,4],其中乘积最大的子序列为 [2,3] 其乘积为 6.详见:https://leetcode.com/p ...

  9. java中的compareto方法以及LIst列表排序的详细介绍【转】

    java中的compareto方法的详细介绍 javacompareTo  java中的compareto方法,返回参与比较的前后两个字符串的asc码的差值,看下面一组代码 String a=&quo ...

  10. Java迭代器的用法【转】

    迭代器(Iterator) 迭代器是一种设计模式,它是一个对象,它可以遍历并选择序列中的对象,而开发人员不需要了解该序列的底层结构.迭代器通常被称为“轻量级”对象,因为创建它的代价小. Java中的I ...