uniapp App跳转微信小程序并互相传递参数、接收微信小程序传递的参数

本文是uniapp打包成安卓App。

一、注意事项

1、用到了分享功能,在打包App时,需要配置manifest.json:App 模块配置->Share。按照提示填写微信分享的信息,appid的获取参考我的另一篇文章:uniapp项目 App端实现微信登录、QQ登录

2、因为涉及到第三方 SDK 的配置,需要打包自定义基座进行测试。


3、需要在微信开放平台开启APP跳转小程序,并关联相应的小程序。
微信开放平台 -> 移动应用 -> 查看 -> 最下面的关联小程序信息,配置关联小程序。

二、代码实现

1、App端跳转微信小程序

注意:与微信小程序跳转微信小程序不同,App端不支持 uni.navigateToMiniProgram,App平台打开微信小程序,需要使用plus.share的 launchMiniProgram

appJumpMiniPro() {
  // 获取分享服务列表
  plus.share.getServices(
    res => {
      let sweixin = '';
      for (var i = 0; i < res.length; i++) {
        let t = res[i];
        if (t.id == 'weixin') {
          sweixin = t;
        }
      }
      if (sweixin) {
        sweixin.launchMiniProgram(
          {
            id: 'gh_32620xxxxxx',  // 要跳转小程序的原始ID
            path: `pages/tslogin/tslogin?do=login&appName=暴漫APP`,  //  可带参数
            type: 2   // 微信小程序版本类型可取值: 0-正式版; 1-测试版; 2-体验版。 默认值为0。
          },
          // 目标小程序点击返回App后执行的回调,在此接收微信小程序传递的参数
          res2 => {
            console.log(typeof res2, res2)
            // res2是微信小程序传递回来的参数 类型为string 需转化为js对象使用
            let result = JSON.parse(res2)
            console.log(result) 
            // 拿到参数后执行你需要的逻辑    
            ......   
          },
          err2 => {
            console.log(err2)
          }
        );
      }
      else {
        uni.showToast({
          icon: 'none',
          title: '当前环境不支持微信操作!'
        })
      }
    },
    err => {
      console.log(err)
    }
  )
}

2、微信小程序端返回App端

下面的代码基于微信小程序也是uniapp开发的,原生的写法稍微有点不一样,详情见:打开 App | 微信开放文档

<template>
  <view class="page-container">
    <view class="">移动应用:{{appName}}</view>
    <button class="bottom" open-type="launchApp" :app-parameter="JSON.stringify(form)" @error="launchAppError">返回APP</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      appName: '',
      form: {
        cid: 4408111111111,
        libs: ['中山图书馆','广州图书馆','中山图书馆','广州图书馆']
      }
    }
  },
  onLoad(option) {
    console.log(option)
    this.appName = option.appName
  },
  methods: {
    launchAppError(e) {
      console.log(e.detail)
      uni.showToast({icon:'none', title:e.detail.errMsg})
    }
  }
}
</script>

第一次做这样的功能,记录一下。希望能帮到你。

完。记录于2021-11-11。

  • 7
    点赞
  • 34
    收藏
    觉得还不错? 一键收藏
  • 8
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值