我是靠谱客的博主 老迟到水壶,最近开发中收集的这篇文章主要介绍微信小程序跳转第三方H5的方法,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

使用web-view标签进行跳转

首先建立一个新的页面,这个页面就是为了第三方H5页面准备的。

在index.wxml中,写以下代码

<web-view src="{{h5url}}"></web-view> // 微信小程序提供的标签

在index.js中,写一下代码

data: {
h5url:"https://eoaptest.cebbank.com:8443/uiap/ccs/chath5.html"
}
// 微信小程序的data中,h5url为第三方h5的链接

在需要点击跳转第三方页面的地方,js文件中用以下代码实现跳转

 wx.navigateTo({
url: "../../pay/serviceH5/index"
})
// wx.navigateTo是小程序提供的跳转方法,url是新建h5页面的路径

以上代码就实现了跳转第三方链接/H5页面

项目中大部分时候,需要链接拼接token进行跳转,那么在封装好接口之后用以下方式跳转

请求token的页面绑定点击事件用wx.navigateTo进行跳转

 toService: function () {
API.queryUserInfoForCCMini( params ).then ( res => {
const serviceToken = encodeURIComponent(res.userinfoForCCMiniModel.token)
console.log(serviceToken)
wx.navigateTo({
url: `../pay/ser/index?h5url=https://eonk.com/uiap/ccs/chath5.html?token=${serviceToken}`,
})
})
},

最后

以上就是老迟到水壶为你收集整理的微信小程序跳转第三方H5的方法的全部内容,希望文章能够帮你解决微信小程序跳转第三方H5的方法所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(36)

评论列表共有 0 条评论

立即
投稿
返回
顶部