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

新建H5页面

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

javascript 复制代码
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处理
javascript 复制代码
在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); // 页面跳转失败的回调函数
        },
      });
    },
相关推荐
速易达网络1 小时前
RuoYi、Vue CLI 和 uni-app 结合构建跨端全家桶方案
javascript·vue.js·低代码
耶啵奶膘1 小时前
uniapp+firstUI——上传视频组件fui-upload-video
前端·javascript·uni-app
视频砖家2 小时前
移动端Html5播放器按钮变小的问题解决方法
前端·javascript·viewport功能
lyj1689972 小时前
vue-i18n+vscode+vue 多语言使用
前端·vue.js·vscode
racerun3 小时前
小程序导航设置更多内容的实现方法
小程序
说私域3 小时前
基于开源AI智能名片链动2+1模式S2B2C商城小程序的超级文化符号构建路径研究
人工智能·小程序·开源
mg6683 小时前
微信小程序入门实例_____快速搭建一个快递查询小程序
微信小程序·小程序
小白变怪兽4 小时前
一、react18+项目初始化(vite)
前端·react.js
ai小鬼头4 小时前
AIStarter如何快速部署Stable Diffusion?**新手也能轻松上手的AI绘图
前端·后端·github