小程序和h5页面之间的互相跳转传参

小程序跳转到 h5 页面

小程序代码:

<web-view src="{{url}}" bindmessage="handlePostMessage"></web-view>
 
onLoad: function (options) {
 this.setData({
   url: decodeURIComponent(options.url),
 });
},
 
// 接收 h5 页面传递过来的参数
handlePostMessage: function (e) {
  const data = e.detail;
  console.log(data);
}

h5 页面代码:

//引入wx插件
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
//返回小程序带参
<script type="text/javascript">
			function ready(e) {
				var name = document.getElementsByClassName("name")[0].value
				var passwords = document.getElementsByClassName("passwords")[0].value
				console.log(name)
				
				wx.miniProgram.getEnv(function(res) {
					if(res.miniprogram) {
						wx.miniProgram.switchTab({
							url: '/pages/index/index'
						});
						wx.miniProgram.postMessage({
							data: {
								name: name,
								passwords :passwords
							}
						}); // 传的参数
					}
				});

			}
</script>

猜你喜欢

转载自blog.csdn.net/qq_42363090/article/details/89633861