(微信小程序系列:一)携带参数跳转半屏微信小程序 先 A->B 后 B ->A

Posted 北极光之夜。

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了(微信小程序系列:一)携带参数跳转半屏微信小程序 先 A->B 后 B ->A相关的知识,希望对你有一定的参考价值。

一.前言

hello,打算以后弄个微信小程序的常用技巧的文章系列,这是第一篇~ 以后会持续更

二.概念

普通的小程序里跳转其它小程序大家都知道,用wx.navigateToMiniProgram,而跳半屏的小程序比较少,是用wx.openEmbeddedMiniProgram。效果大概如下,一般把跳转的小程序当个工具使用。 官方文档

且要注意配置:

三.A小程序->B小程序 并携带参数

在A小程序定义一个方法,返回写入跳转的方法

A:

 wx.openEmbeddedMiniProgram(
      extraData: "Id":Id,  // 传要跳转到B的参数,对象来的,自定义属性值
      appId: '  ', // B的appid
      envVersion:'trial' , //B的类型  trial体验版, ‘release’正式版    ‘develop’开发版
      success:function()
        console.log('跳转小程序成功');
      ,
      fail:function()
        console.log('跳转小程序失败');
      
    )

B: 要接受这个A跳转过来的参数,找到B的app.js文件 ,在 onShow 这个生命周期里接收 (onLaunch和onShow都可以接收到)

onShow(options) 
  if(options.referrerInfo.appId=='A的appid')
       //传的参数在 options.referrerInfo.extraData 里
   

四.B小程序 回到->A小程序 并携带参数

B里写回到A的方法:

 wx.navigateBackMiniProgram(
  extraData: "Id":Id,  // 传要跳转到B的参数,对象来的,自定义属性值
    ) 
   

找到A的app.js文件 ,在 onShow 这个生命周期里接收:

onShow(options) 
  if(options.referrerInfo.appId=='B的appid')
       //传的参数在 options.referrerInfo.extraData 里
   

五.总结

最近刚通关了 荒野大镖客救赎2 ,不得不说,艺术!(虽然我是狼结局 。。。)

我的哔哩哔哩空间
Gitee仓库地址:全部特效源码
其它文章:
~关注我看更多简单创意特效:
文字烟雾效果 html+css+js
环绕倒影加载特效 html+css
气泡浮动背景特效 html+css
简约时钟特效 html+css+js
赛博朋克风格按钮 html+css
仿网易云官网轮播图 html+css+js
水波加载动画 html+css
导航栏滚动渐变效果 html+css+js
书本翻页 html+css
3D立体相册 html+css
霓虹灯绘画板效果 html+css+js
记一些css属性总结(一)
Sass总结笔记
…等等
进我主页看更多~

以上是关于(微信小程序系列:一)携带参数跳转半屏微信小程序 先 A->B 后 B ->A的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序系列:一携带参数跳转半屏微信小程序 先 A->B 后 B ->A

微信小程序页面跳转方法和携带参数详解

微信小程序之wx.navigateback往回携带参数

微信小程序页面跳转方法和携带参数详解

微信小程序即将支持 分享朋友圈 半屏显示

微信小程序怎么把变量传到另一个页面?