web-view小程序转发功能,web-view和小程序之间传参
Posted 打个大西瓜
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了web-view小程序转发功能,web-view和小程序之间传参相关的知识,希望对你有一定的参考价值。
web-view的src只能带一个参数src="…?a=1"
h5页面
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == ‘micromessenger‘) { //判断是否是微信环境 //微信环境 wx.miniProgram.getEnv(function (res) { if (res.miniprogram) { // 小程序环境下逻辑 //小程序发送信息``` var info = { title: ‘11‘, //参数一 value: ‘22‘, //参数二 }; wx.miniProgram.postMessage({ data: info }); } else { window.location.href = ‘https://www.baidu.com‘; //非小程序环境下逻辑 } }) } else { //非微信环境逻辑 window.location.href = ‘https://blog.csdn.net/qq_37235231/article/details/82053062‘; }
小程序页面
index.wxml页面
<web-view src="{{webUrl}}" bindmessage="msgHandler"></web-view>
index.js页面
Page({ msgHandler: function (e) { //(h5像小程序传递参数) console.log(e.detail.data) //获取到来自也页面的数据 var info = (e.detail.data)[0] this.setData({ value: info.value }); this.setData({ title: info.title }); }, onShareAppMessage: function (options) { //转发时执行 var that = this; console.log(this.data.webUrl); return { title: that.data.title, path: ‘/pages/index/index?value=‘ + that.data.value,//小程序像h5传递参数 success(e) { // shareAppMessage: ok, // shareTickets 数组,每一项是一个 shareTicket ,对应一个转发对象 // 需要在页面onLoad()事件中实现接口 wx.showShareMenu({ // 要求小程序返回分享目标信息 withShareTicket: true }); }, } }, onload:function(options){ var webUrl = ‘‘; if (options.value) {//获取转发过来的参数 webUrl = "https://www.jiquer.com/vity/gdsen.xhtm?value=" + options.value; } else { webUrl = "https://www.jiquer.com/vity/gdsen.xhtm" } this.setData({ webUrl: webUrl }) } })
h5的js页面(获取并处理小程序传递过来的参数)
function getParamer() { var url = window.location.href.split("?")[1]; /*获取url里"?"后面的值*/ if (url) { /*判断是否是一个参数还是多个参数*/ url = url.split("=") return url[1]; /*返回想要的参数值*/ } else { return ‘‘; } }
本文链接:https://blog.csdn.net/qq_37235231/article/details/82053062
以上是关于web-view小程序转发功能,web-view和小程序之间传参的主要内容,如果未能解决你的问题,请参考以下文章
小程序总结(十五)- 关于web-view嵌套的H5页面的分享功能