Vue项目(H5)与微信小程序来回跳转

本文主要是介绍Vue项目(H5)与微信小程序来回跳转，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

新建H5页面

在小程序里面新建一个名为H5的文件夹，以及H5页面

H5.WXML
<web-view src="{{h5Url}}" bindmessage="handleGetMessage"></web-view>H5.JSdata: { 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); // 页面跳转失败的回调函数},});},

这篇关于Vue项目(H5)与微信小程序来回跳转的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---