【记录6】小程序嵌入的H5页面向小程序跳转并传参

首先,这个H5页面在小程序里面是用web-view标签嵌入的

<web-view src=""></web-view>

在H5页面里进行H5向小程序的跳转及传参

在H5中引入 weixin-js-sdk

安装weixin-js-sdk

npm install weixin-js-sdk --save

引入

import wx from "weixin-js-sdk";

跳转

 wx.miniProgram.navigateTo({
		url:`/pages/map/navigation?lat=${latitude}&lng=${longitude}`,
		success: (res) => {
	 	  console.log(res);   // 页面跳转成功的回调函数
	    },
		fail: (err) => {
	 	  console.log(err);   // 页面跳转失败的回调函数
	    }
 })

url 要跳转的小程序的页面路由,要传的参数跟在后面

跳转后在小程序页面url里面解析出参数

	onLoad(options) {
			// console.log(options)
			if(options.lat && options.lng){
				this.lat = options.lat
				this.lng = options.lng
				console.log(this.lat,this.lng)
			}

注意:路由一定要写正确