当前位置:   article > 正文

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

webview跳转小程序

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

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

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

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

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

  1. wx.navigateToMiniProgram({
  2. appId: option.appid,
  3. path: `${option.path}?id=${option.id}`,
  4. success(res) {
  5. // 打开成功
  6. }
  7. })

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

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

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

  1. wx.showModal({
  2. title: '温馨提示',
  3. content: '提示内容',
  4. showCancel: true, //是否显示取消按钮
  5. cancelText: "取消", //默认是“取消”
  6. cancelColor: '#000000', //取消文字的颜色
  7. confirmText: "确定", //默认是“确定”
  8. confirmColor: '#3cc51f', //确定文字的颜色
  9. success: function(res) {
  10. if (res.cancel) {
  11. //点击取消,wx.navigateBack
  12. wx.navigateBack()
  13. } else {
  14. // 使用wx.navigateToMiniProgram跳转到小程序
  15. wx.navigateToMiniProgram({
  16. appId: option.appid,
  17. path: `${option.path}?id=${option.id}`,
  18. success(res) {
  19. // 打开成功
  20. }
  21. })
  22. }
  23. },
  24. fail: function(res) {
  25. //接口调用失败的回调函数,wx.navigateBack
  26. },
  27. complete: function(res) {
  28. //接口调用结束的回调函数(调用成功、失败都会执行)
  29. },
  30. })

声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号