微信小程序> 微信小程序(1)——webview和小程序间传递参数、发送消息

微信小程序(1)——webview和小程序间传递参数、发送消息

浏览量:571 时间: 来源:衡与墨

小程序向web-view发送消息

web-view组件中有一个属性src(src是webview 指向网页的链接。可打开关联的公众号的文章,其它网页需登录小程序管理后台配置业务域名。)

通过设置src中GET参数即可向网页传递参数:
web-view src="https://mp.weixin.qq.com?name='name'&age=12"/web-view

web-view怎么获取消息呢?
见代码:

$(function () {//添加一个获取参数的函数(function ($) {    $.getUrlParam = function (name) {        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)")        var r = window.location.search.substr(1).match(reg)        if (r != null) return unescape(r[2])        return null    }})(jQuery)//name 和 age即是微信小程序传递过来的参数        var name = $.getUrlParam('name')        var age = $.getUrlParam('age')})

web-view向小程序发送消息

在html文件中引入微信小程序官方的js 接口:
script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"/script
js文件中:

//getEnv获取环境wx.miniProgram.getEnv(function (res) { if (res.miniprogram) { //如果当前是小程序环境wx.miniProgram.postMessage({ data:  { name: 'name',age: 12}})} })

小程序怎么获取消息呢?
见代码:
1、在web-view组件中添加bindmessage(网页向小程序 postMessage 时,会在特定时机(小程序后退、组件销毁、分享)触发并收到消息。e.detail = { data })
web-view src="{{url}}" bindmessage="deal_with_msg"/web-view
2、在js文件中添加事件处理:

Page({ deal_with_msg: function (e) { var data = e.detail.datathis.setData({ name: data.name,age: data.age})}})

这篇文章对您有帮助吗,点赞让博主知道…

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎