小程序web-view中嵌套H5如何跳转其他小程序

首先web-view中H5是无法跳转到其他小程序的只能通过H5跳转回小程序，再让小程序跳转到其他小程序H5跳转回小程序使用wx.miniProgram.navigateTo()小程序跳转小程序使用wx.navigateToMiniProgram(),官方文档有示例，用法很简单，只需要传入appid,还有path(可选参数，不是必须的，不传则默认跳转到小程序首页)在小程序中我新建了一个页面用来做跳转

-阿大头

8105人浏览 · 2022-04-26 11:11:54

-阿大头 · 2022-04-26 11:11:54 发布

首先web-view中H5是无法直接打开其他小程序的

只能通过H5跳转回小程序，再让小程序跳转到其他小程序

H5跳转回小程序使用wx.miniProgram.navigateTo()

小程序跳转小程序使用wx.navigateToMiniProgram(),官方文档有示例，用法很简单，只需要传入appid,还有path(可选参数，不是必须的，不传则默认跳转到小程序首页)

在小程序中我新建了一个页面用来做跳转其他小程序，逻辑是这样的，H5中跳回这个新建的页面（携带参数），然后在生命周期onLoad()中调用wx.navigateToMiniProgram()

wx.navigateToMiniProgram({
	appId: option.appid,
	path: `${option.path}?id=${option.id}`,
	success(res) {
	// 打开成功
	}
})

但是奇怪的问题出现，我真机调试的时候第一次可以跳转到其他小程序，第二次不行，点几次不行之后，又可以一次，其中什么规律我也没摸清楚（也有可能没有规律），然后打开调试，wx.navigateToMiniProgram这个方法报navigateToMiniProgram:fail can only be invoked by user TAP gesture

意思大概就是该事件只能由用户手动触发

所以我在onLoad()中多加了一个uni.showmodel,当点击确定的时候，再去调用wx.navigateToMiniProgram这个api,然后就可以了。

wx.showModal({
						title: '温馨提示',
						content: '提示内容',
						showCancel: true, //是否显示取消按钮
						cancelText: "取消", //默认是“取消”
						cancelColor: '#000000', //取消文字的颜色
						confirmText: "确定", //默认是“确定”
						confirmColor: '#3cc51f', //确定文字的颜色
						success: function(res) {
							if (res.cancel) {
								//点击取消，wx.navigateBack
								wx.navigateBack()
							} else {
								// 使用wx.navigateToMiniProgram跳转到小程序
								wx.navigateToMiniProgram({
									appId: option.appid,
									path: `${option.path}?id=${option.id}`,
									success(res) {
										// 打开成功
									}
								})
							}
						},
						fail: function(res) {
							//接口调用失败的回调函数，wx.navigateBack
						},
						complete: function(res) {
							//接口调用结束的回调函数（调用成功、失败都会执行）
						},
					})