小程序与H5交互

        最近项目需求,要求H5点击完成时,要将部分数据发送到小程序中,根据开发文档,最终能够获取,期间遇到好多雷,在此做个笔记。

        无论什么时候,都要查看官方给的最新文档!

        首先要实现页面跳转,这是必须的,标签,这里要注意了,在这个标签中要添加bindmessage="bindGetMsg",

这是用来获取数据的必要途径。进入H5页面,如果要实现传值,一定要在H5页面中添加 

这应该是个插件(没有玩过H5。。)。然后,在你需要返回的事件中添加wx.miniProgram.postMessage({data:{foo:"content"}})来传值(具体数据自己定)。然后添加返回的方法wx.miniProgram.navigateBack();还要记得添加这个方法:

点击完成,这时就去小程序那里接收去。刚才我们定义的接收数据的方法(bindGetMsg)

        通过打印log可以看到是否有数据。不知道为什么,一开始有数据,一会没数据,现在一直能收到数据,不知道哪里的问题,有待研究吧,最后贴一下代码

        还要记得,在小程序开发工具中,把详情中的‘调试基础库’改一下,否则也无法获取到数据


H5的HTML文件


H5的js文件


小程序wxml文件


小程序js文件

你可能感兴趣的:(小程序与H5交互)