1. h5跳转小程序有两种情况
(1)从普通浏览器打开的h5页面跳转小程序使用wx-open-launch-weapp可以实现h5跳转小程序
<wx-open-launch-weapp
style="display:block;"
v-else
id="launch-btn"
:username="wechatYsAppid"
:path="path">
<script type="text/wxtag-template">
<style>
.btn {
width: 100%;
height: 48px;
margin-top: 21px;
font-size: 18px;
color: #FFFFFF;
line-height: 48px;
text-align: center;
border-radius: 15px;
background-color: #01CB88;
font-weight: 500;
border:none;
}
</style>
<button class="btn">跳转小程序</button>
</script>
</wx-open-launch-weapp>
(2)从小程序环境中的H5页面(也就是从小程序中通过web-view跳转到的H5页面)跳到小程序
//先判断当前页面所处环境是否为微信内置浏览器,如果是则代表是web-view页面,则使用:
//是否是微信内置浏览器
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
console.log("micromessenger"); //微信内置浏览器
wx.miniProgram.navigateTo({
url: `/pages/books/index?AuthOauthToken=${AuthOauthToken}&productId=[10]&source=takes`, // 小程序内页面路径及查询参数
success:function(res) {
},
fail:function(res) {
}
});
}
3.小程序跳转其他小程序,使用wx.navigateToMiniProgram()跳转
let path=`pages/sys/booksAuthOauthToken=${AuthOauthToken}&productId=${productId}&to=${encodeURIComponent('/pages/look/index')}&productId=[3,4]`;
uni.navigateToMiniProgram({
// 某某小程序
appId: this.$httpWX.azAppId,
path: path,
query: {
AuthOauthToken: AuthOauthToken,
origin: "fff",
to: encodeURIComponent('/pages/look/index')
},
envVersion: this.$httpWX.envVersion,
success: (res) => {},
fail: (fail) => {
uni.showToast({
icon: "none",
title: '您已取消'
})
uni.switchTab({
url: "/pages/Main/main"
})
}
})
4.小程序跳转H5
使用web-view标签跳转,这里先不多做介绍~~