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

1、App端跳转微信小程序(注意id一定是小程序的原始ID,在小程序后台设置-基本设置里可以看到)

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

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

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

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

javascript 复制代码
<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>
相关推荐
小泽呀x2 小时前
微信小程序中使用离线版阿里云矢量图标
微信小程序·小程序
fakaifa2 小时前
CRMEB Pro版v3.1源码全开源+PC端+Uniapp前端+搭建教程
前端·小程序·uni-app·php·源码下载
转角羊儿2 小时前
uni-app请求方法封装⑦
uni-app
java知路2 小时前
uniapp h5实现录音
uni-app
托马斯-酷涛3 小时前
小程序源码-模版 100多套小程序(附源码)
小程序
haodanzj4 小时前
在uniapp中封装请求接口 (带刷新token)
前端·javascript·uni-app
空&白5 小时前
uniapp h5地址前端重定向跳转
前端·uni-app
小蒜学长5 小时前
springboot基于SpringBoot的企业客户管理系统的设计与实现
java·spring boot·后端·spring·小程序·旅游
工业互联网专业5 小时前
Python毕业设计选题:基于Django+uniapp的公司订餐系统小程序
vue.js·python·小程序·django·uni-app·源码·课程设计
家里有只小肥猫5 小时前
关于vue生命周期
uni-app·uniapp