h5页面与小程序页面互相跳转

小程序跳转h5页面

  • 一个home页 /pages/home/home
    • 一个含有点击事件的元素:
    • toWebView(){ wx.navigateTo({ url: '/pages/webview/webview' }) }
  • 一个webView页 /pages/webview/webview
    • 放上web-view标签

h5页面跳回小程序

  • 在h5项目中引入JS-SDK ,我的是vue2项目,直接在index.html的head中引入
  • 在需要返回到小程序的页面加一个元素,点击返回,正常情况下都能顺利返回到小程序首页
  • 在返回的点击事件中调用wx.miniProgram.navigateTo({url:'pages/index/index'})

h5跳回小程序——试过的其他无效方式

  • wx.navigateBack({ delta: 1 });
  • 这种方式在微信开发者工具中能正常跳转,手机上测试也能正常返回,但是客户那里的这个h5页面跳回他们自己的小程序无效;
  • wx.closeWindow()
  • 适用于从公众号进入这个h5的小程序,关闭后回到公众号页面;

小程序内部跳转另一个小程序

  • 这种方式在h5页面使用是无效的
wx.navigateToMiniProgram({
  appId: '', // 另一个小程序的appid
  path: 'page/index/index?id=123',  // 要跳转的页面路径
  extraData: {  // 要传给目标小程序的数据
    foo: 'bar'
  },
  // 要打开的小程序版本  develop:开发版  trial:体验版 release:正式版
  envVersion: 'develop',
  success(res) {
    // 打开成功
  }
})

web-view内支持的跳转方式

h5页面与小程序页面互相跳转

上一篇:t610和t618(天玑800和虎贲t618哪个好)
下一篇:python-在PyCharm中使用PyQt5