uniapp 微信公众号H5/app/小程序跳转小程序
1.微信公众号H5跳转小程序使用微信标签wx-open-launch-weapp
a.在init.vue使用标签（要实现跳转的页面）
<wx-open-launch-weapp
id="launch-btn"
style="width: 100%; display: block"
:appid="pageParam.appId"
:path="pageParam.path" >
<script type="text/wxtag-template">
<view style="border: 2rpx solid rgb(73, 162, 238) !important;border-radius: 34rpx;color: rgb(73, 162, 238);padding: 10rpx 10rpx;text-align: center;font-weight: 200;font-size: 32rpx;" class="realNameAuth">前往实名</view></script>
</wx-open-launch-weapp>
//b.从接口获取配置信息并调用，
created() {
let query = {
url: window.location.href,
appId: store.state.user.appId,
};
if (this.payInfo.operator == 1) {
getSignature(query)
.then((res) => {
let iccidNum = this.iccid.substring(0, 19);
this.pageParam.path = "/pages/login/index?iccid=" + iccidNum;
this.handlesWeiXin(res.data);
})
.catch((err) => {});
}
},
//配置wx.config
handlesWeiXin(params) {
const { appId, nonceStr, signature, timestamp } = params; //从接口获取
wx.config({
// debug: true,
appId: appId, // 必填，公众号的唯一标识
timestamp: timestamp, // 必填，生成签名的时间戳
nonceStr: nonceStr, // 必填，生成签名的随机串
signature: signature, // 必填，签名
jsApiList: ["checkJsApi"], // 必填，需要使用的JS接口列表
openTagList: ["wx-open-launch-weapp"], // 可选，需要使用的开放标签列表，例如['wx-open-launch-weapp','wx-open-launch-app']
});
wx.ready(function () {
//config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中
});
wx.error(function (res) {
// uni.showToast({
// title:res.err,
// duration: 500
// });
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
});
},
c.如果上述跳转没成功，那么是因为uni自带的window.wx给污染了js文件的wx全局变量；需要在APP.vue页面的method方法里面加上如下代码，并在onLaunch中调用；然后就可以跳转了
onLaunch: function () {
console.log("App Launch");
this.addScript();
},
methods: {
//wx.config配置无效解决---（原因是uni自带的window.wx给污染了js文件的wx全局变量）
addScript() {
const that = this;
window.wx = null;
const script1 = document.createElement("script");
script1.type = "text/javascript";
script1.src = "https://res.wx.qq.com/open/js/jweixin-1.6.0.js";
document.head.appendChild(script1);
script1.onload = function () {
const script2 = document.createElement("script");
script2.type = "text/javascript";
script2.src =
"https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js";
document.head.appendChild(script2);
script2.onload = function () {
// TODO something
};
};
},
},
2.APP跳转小程序
a.通过uniapp开发的APP跳转小程序实现，首先用到APP分享功能，需要在manifest.json中APP常用配置勾选share分享中的微信分享，填上APPid
b.在需要跳转的按钮绑定如下方法，就可以实现跳转了
appJumpMiniPro() {
// console.log("isok------", this.pageParam.path);
let that = this
// 获取分享服务列表
plus.share.getServices(
function (res) {
var sweixin = null;
for (var i = 0; i < res.length; i++) {
var t = res[i];
if (t.id == "weixin") {
sweixin = t;
}
}
if (sweixin) {
sweixin.launchMiniProgram({
id: "gh_xxxxxx", //这里写你的小程序原始id（以gh开头），可以在需要跳转的小程序中可以找到
type: 0, //这里是不同的环境（默认0）
path: that.pageParam.path, //这里是指定页的路径，如需传参直接字符串拼接（首页可以省略）
});
}else{
plus.nativeUI.alert('当前环境不支持微信操作!')
}
},
function (res) {
console.log(JSON.stringify(res),'---9898989');
}
);
},
3.小程序跳小程序，就简单很多使用下面这个方法就可以实现了
wx.navigateToMiniProgram({
appId: '目标小程序appid',
path: '目标小程序页面路径',
//develop开发版；trial体验版；release正式版
envVersion: 'release',
success(res) {
// 打开成功
console.log("跳转小程序成功！",res);
}
})
原文地址：https://blog.csdn.net/B2689429488/article/details/142987801
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！