小程序跳转H5或者其他小程序

  1. h5跳转小程序有两种情况

(1)从普通浏览器打开的h5页面跳转小程序使用wx-open-launch-weapp可以实现h5跳转小程序

html 复制代码
<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页面)跳到小程序

javascript 复制代码
//先判断当前页面所处环境是否为微信内置浏览器,如果是则代表是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()跳转

javascript 复制代码
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标签跳转,这里先不多做介绍~~

相关推荐
百锦再6 分钟前
从 .NET 到 Java 的转型指南:详细学习路线与实践建议
android·java·前端·数据库·学习·.net·数据库架构
i小杨18 分钟前
前端埋点(打点)方案
前端·状态模式
前端加油站31 分钟前
时间转换那些事
前端·javascript
风清云淡_A1 小时前
【VUECLI】node.js打造自己的前端cli脚手架工具
前端·node.js
YuspTLstar1 小时前
一文掌握Redux-toolkit核心原理
前端·react.js
云枫晖1 小时前
手写Promise-静态方法all和allSettled
前端·javascript
weixin_456904271 小时前
前端开发时npm install报错解决方案
前端·npm·node.js
东华帝君1 小时前
Object.create继承
前端
王嘉俊9251 小时前
Flask 入门:轻量级 Python Web 框架的快速上手
开发语言·前端·后端·python·flask·入门
风继续吹..1 小时前
Express.js 入门指南:从零开始构建 Web 应用
前端·javascript·express