新建H5页面
在小程序里面新建一个名为H5的文件夹,以及H5页面文章来源地址https://www.toymoban.com/news/detail-851026.html
H5.WXML
<web-view src="{{h5Url}}" bindmessage="handleGetMessage"></web-view>
H5.JS
data: {
h5Url:'https://xxx.com/login' 要跳转的H5页面
},
H5回来的回调方法
handleGetMessage: function (e) {
console.log('handleGetMessage', e)
if (e.detail.data[0].result == 'success') {
// 确认支用-签约成功调用
}
},
onLoad(options){
H5跳转回来后的参数在options里面
}
Vue处理
在index.html里面新增
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
// 跳回小程序
goBackMini() {
wx.miniProgram.navigateTo({
url: `/pages/insure/pay?paymentNo=33&checkNo=222`, // 指定跳转至小程序页面的路径
success: (res) => {
console.log(res); // 页面跳转成功的回调函数
},
fail: (err) => {
console.log(err); // 页面跳转失败的回调函数
},
});
},
文章来源:https://www.toymoban.com/news/detail-851026.html
到了这里,关于Vue项目(H5)与微信小程序来回跳转的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!