微信小程序开发如何实现打开另一个小程序

  介绍

小编这次要给大家分享的是微信小程序开发如何实现打开另一个小程序,文章内容丰富,感兴趣的小伙伴可以来了解一下,希望大家阅读完这篇文章之后能够有所收获。

微信小程序打开另一个小程序,有两种方法:1。超链接;2。点击按钮。

全局配置:

跳转到其他小程序,需要在当前小程序全局配置中配置需要跳转的小程序列表,代码如下:

应用程序。json

{   …   “navigateToMiniProgramAppIdList":(   “wxe5f52902cf4de896"   ]   }

否则会弹出以下错误提示:

微信小程序开发如何实现打开另一个小程序

超链接实现跳转到小程序:

演示。wxml

& lt;导航器   目标=癿iniProgram"   开式=皀avigate"   应用id=皐xdbcxxxxxxxx985f"   路径=耙?索引/index& # 63; goods_id=201,   额外的数据=https://www.yisu.com/zixun/眥{extraData}}”   version="发展"   bindsuccess=" toMiniProgramSuccess ">点击超链接打开绑定的小程序

演示。js

数据:{   extraData: {   来自:& # 39;优享新可能nav # 39;   }   }   …   toMiniProgramSuccess (res) {//从其他小程序返回的时候触发   wx.showToast ({   标题:& # 39;通过超链接跳转其他小程序成功返回了& # 39;   })   }

相关参数:

属性名类型默认值说明targetStringself设置为miniProgram,则跳转都其他小程序app-idString 要打开的小程序appIdpathString 打开的页面路径,如果为空则打开首页,可带参数extra-dataObject 需要传递给目标小程序的数据,目标小程序可在,App.onLaunch (), App.onShow(),中获取到这份数据。详情versionversionrelease要打开的小程序版本,有效值开发(开发版),试验(体验版),释放(正式版),仅在当前小程序为开发版或体验版时此参数有效,如果当前小程序是正式版,则打开的小程序必定是正式版.bindsuccessString 跳转小程序成功bindfailString 跳转小程序失败bindcompleteString 跳转小程序完成

备注:

1.额外的数据必须为对象类型,可以在数据中定义,然后模板中引用;

2.版本可以为空,以小程序当前环境为准。如果设置有值,则只在当前小程序为非正式版时有效。如果设置为发展,那么最好先用微信预览最新编译过的需要跳转到的小程序,然后再扫码预览原来的小程序,不然的话跳转到的小程序可能不是最新版;

3. bindsuccess回调事件在跳转到小程序返回之后触发,wx。navigateToMiniProgram Api则是在跳转同时触发。

通过按钮单击事件实现:

演示。wxml

& lt;按钮bindtap=& # 39; navigateToMiniProgram& # 39;比;   点击按钮打开其他小程序   & lt;/button>

演示。js

navigateToMiniProgram () {   wx.navigateToMiniProgram ({   appId: & # 39; wxdbcxxxxx985f& # 39;   路径:& # 39;页/索引/index& # 63; goods_id=201 & # 39;   extraData: {   来自:& # 39;xxxxx # 39;   },   envVersion: & # 39;开发# 39;   成功(res) {//打开其他小程序成功同步触发   wx.showToast ({   标题:& # 39;跳转成功& # 39;   })   }   })   }

相关参数:

属性类型默认值是否必填说明appIdstring 是要打开的小程序appIdpathstring 否打开的页面路径,如果为空则打开首页extraDataobject 否需要传递给目标小程序的数据,目标小程序可在,App.onLaunch, App.onShow 中获取到这份数据.envVersionstringrelease否要打开的小程序版本。仅在当前小程序为开发版或体验版时此参数有效。如果当前小程序是正式版,则打开的小程序必定是正式版.successfunction 否接口调用成功的回调函数failfunction 否接口调用失败的回调函数completefunction 否接口调用结束的回调函数(调用成功,失败都会执行)

目标小程序接收来源小程序传递过来的参数:

目标小程序应用。js

应用程序({   alt="微信小程序开发如何实现打开另一个小程序">

输出如下:

微信小程序开发如何实现打开另一个小程序

注意:

1。先选择进入场景,输入1037就能快速定位到从小程序进入这个选项,然后就会显示设置appid及extraData的输入框;

2。尤其要注意extraData的格式,与来源小程序中传递过来的格式都有点不一样,请严格参照下边的代码:

微信小程序开发如何实现打开另一个小程序