微信小程序开发打开另一个小程序的实现方法_javascript技巧

来源:脚本之家  责任编辑:小易  

微信小程序开发工具打开微信小程序的步骤为:1、首先打开微信开发者工具,选择小程序在右侧点击加号添加项目:2、进入添加项目填写,铁屑项目名称,设置目录,最后填写AppID,最后点击新建:3、点击创建后,进入此页面即创建一个新项目:4、最后进入自己项目中,拷贝所有项目文件到新创建的项目就打开了:www.zgxue.com防采集请勿采集本网。

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

嗯 开发好了小程序放在公众号自定义菜单 这样可以从公众号里面进入小程序 但是小程序和公众号接口不同的情况下 数据也不通 具体可以问你们技术

全局配置:

小程序基本成为企业的另一个标配了,开发微信小程序要多少钱是根据你zd的开发需求来的,如果你开发功能多那价格基本要几万到十几万不等,如果你用令容小程序,那价格也就几版千块钱,根据你的

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

微信小程序管理后台只有一个管理员可以登陆,可以同时绑定10个开发者和20个体验者,开发者们可以通过版本管理工具(比如SVN或者Git等)共同开发,但是向微信后台提交代码只能由管理员一人实现

App.json

目前支付宝小程序又三个入口, 支付宝内直接搜索 好友分享或zhidao吱口令 支付宝朋友列表有一版个小程序和微信小程序是一样权的,公司有技术团队可以自己开发,没有团队就要找第三方合作开发了

{ ... "navigateToMiniProgramAppIdList": [ "wxe5f52902cf4de896" ]}

很多新手多遇到过这个问题,小程序是单独的一个账号,你需要把公众号退出登陆,然后输入你的小程序账号登陆就可以了。

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

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

demo.wxml

<navigator target="miniProgram" open-type="navigate" app-id="wxdbcxxxxxxxx985f" path="pages/index/index?goods_id=201" extra-data="{{extraData}}" version="develop" bindsuccess="toMiniProgramSuccess">点击超链接打开绑定的小程序</navigator>

demo.js

data:{  extraData: {    from: '优享新可能nav'  }}... toMiniProgramSuccess(res){ //从其他小程序返回的时候触发 wx.showToast({ title: '通过超链接跳转其他小程序成功返回了' })}

相关参数:

属性名 类型 默认值 说明
target String self 设置为miniProgram,则跳转都其他小程序
app-id String   要打开的小程序 appId
path String   打开的页面路径,如果为空则打开首页,可带参数
extra-data Object   需要传递给目标小程序的数据,目标小程序可在 App.onLaunch(),App.onShow() 中获取到这份数据。详情
version version release 要打开的小程序版本,有效值 develop(开发版),trial(体验版),release(正式版),仅在当前小程序为开发版或体验版时此参数有效;如果当前小程序是正式版,则打开的小程序必定是正式版。
bindsuccess String   跳转小程序成功
bindfail String   跳转小程序失败
bindcomplete String   跳转小程序完成

备注:

1.extra-data必须为Object类型,可以在data中定义,然后模板中引用;

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

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

通过按钮单击事件实现:

demo.wxml

<button bindtap='navigateToMiniProgram'>点击按钮打开其他小程序</button>

demo.js

navigateToMiniProgram(){ wx.navigateToMiniProgram({ appId: 'wxdbcxxxxx985f', path: 'pages/index/index?goods_id=201', extraData: { from: 'xxxxx' }, envVersion: 'develop', success(res) { // 打开其他小程序成功同步触发 wx.showToast({ title: '跳转成功' }) } }) }

相关参数:

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

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

目标小程序app.js

App({ onLaunch: function (options) { console.log("referrerInfo:::", options.referrerInfo) } ...})

输出:

{"appId":"wxcc41e47562b08129","extraData":{"from":"xxxxx"}}

开发者工具调试被打开的小程序时候正确的接收参数:

开发者工具新建编译模式:

输出如下:

注意:

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

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

{"from":"xxxxx"}

注意事项:

1.navigateToMiniProgram Api需要用户主动触发跳转,且在跳转至其他小程序前,将统一增加弹窗,询问是否跳转,用户确认后才可以跳转其他小程序。如果用户点击取消,则回调fail cancel;

2.每个小程序可跳转的其他小程序数量限制为不超过 10 个;

3.在开发者工具上调用此 API 并不会真实的跳转到另外的小程序,但是开发者工具会校验本次调用跳转是否成功。

4. 开发者工具上支持被跳转的小程序处理接收参数的调试

到此这篇关于微信小程序开发打开另一个小程序的实现方法的文章就介绍到这了,更多相关小程序打开另一个小程序内容请搜索真格学网以前的文章或继续浏览下面的相关文章希望大家以后多多支持真格学网!

在开发之前,必须先接入到微信第三方开发的授权。1、微信小程序注册:在微信公众平台注册小程序,完成注册后可以同步进行信息完善和开发。2、微信小程序信息完善:填写小程序基本信息,包括名称、头像、介绍及服务范围等。3、微信小程序开发:完成小程序开发者绑定、开发信息配置后,开发者可下载开发者工具、参考开发文档进行小程序的开发和调试。4、微信小程序提交审核和发布:完成小程序开发后,提交代码至微信团队审核,审核通过后即可发布(公测期间不能发布)内容来自www.zgxue.com请勿采集。


  • 本文相关:
  • 微信小程序实现打开并下载服务器上面的pdf文件到手机
  • 微信小程序新手教程之页面打开数量限制
  • 微信小程序实现打开内置地图功能【附源码下载】
  • web 前端常用组件之layer弹出层组件
  • javascript中es6字符串扩展方法
  • bootstrap日历插件datetimepicker使用方法
  • 利用js获取下拉框中所选的值
  • js高级运动实例分析
  • js与jquery获取父元素,删除子元素的两种不同方法
  • 微信小程序实现列表页的点赞和取消点赞功能
  • javascript嵌套函数和在函数内调用外部函数的区别分析
  • 记录一次完整的react hooks实践
  • [转]去百度面试的javascript 收获
  • 微信开发者工具怎么打开另一个小程序
  • 微信小程序开发工具 怎么打开微信小程序
  • 微信小程序开发工具 怎么打开微信小程序
  • 怎么才能开发一个微信小程序呢?
  • 微信小程序和微信公众号开发是一定要同一个后台吗
  • 开发一个微信小程序要多少钱?小程序是怎么收费的?
  • 一个微信小程序可以有多个人同时开发吗
  • 支付宝小程序怎么使用,入口在哪里,和微信小程序开发环境是一样的吗?
  • 微信小程序里面有一个已经关联的小程序 但是进不了开发者后台
  • 一个人能够开发一个微信小程序吗
  • 网站首页网页制作脚本下载服务器操作系统网站运营平面设计媒体动画电脑基础硬件教程网络安全基础知识javascript类库表单特效广告代码网页特效黑客性质javascript技巧domnode.jsjs其它首页javascriptjavascript技巧微信小程序实现打开并下载服务器上面的pdf文件到手机微信小程序新手教程之页面打开数量限制微信小程序实现打开内置地图功能【附源码下载】web 前端常用组件之layer弹出层组件javascript中es6字符串扩展方法bootstrap日历插件datetimepicker使用方法利用js获取下拉框中所选的值js高级运动实例分析js与jquery获取父元素,删除子元素的两种不同方法微信小程序实现列表页的点赞和取消点赞功能javascript嵌套函数和在函数内调用外部函数的区别分析记录一次完整的react hooks实践[转]去百度面试的javascript 收获js刷新页面方法大全js中settimeout()的用法详解js截取字符串常用方法详细整理js页面跳转常用的几种方式js打开新窗口的2种方式js数组与字符串的相互转换方法js设置cookie、读取cookie、删除js删除数组里的某个元素方法js 将json字符串转换为json对象的javascript深入理解js闭包小程序tab页无法传递参数的方法javascript移除数组内重复元素的方法javascript限制用户只能输汉字中文的方法bootstrap表单布局样式源代码js 实现在2d平面上画8的方法css3元素简单的闪烁效果实现(html5 jquerjs 使用方法与函数 总结使用javascript实现node.js中的path.join二行代码解决全部网页木马详解webpack 配合babel 将es6转成es5 超简
    免责声明 - 关于我们 - 联系我们 - 广告联系 - 友情链接 - 帮助中心 - 频道导航
    Copyright © 2017 www.zgxue.com All Rights Reserved