H5跳转小程序

Vue3+vite

main.js 文件

app.config.compilerOptions.isCustomElement = (tag) => tag.startsWith('wx-open-launch-weapp');
// 防止vue变异报错

Page.vue

<wx-open-launch-weapp  id="launch-btn"
            :username="要跳转的小程序原始id" :path="要跳转的小程序路径">
   <div v-is="'script'" type="text/wxtag-template" style="display:block;z-index: 99;">
       <div style="color: #fff;font-size: 12px;">跳过</div>
   </div>
</wx-open-launch-weapp>




// javascript
axios({
    method: "get",
    url: "https://xxxxxxxxxxxxxx",
    params: {
      url: window.location.href,// 这里建议用带#的hash模式，
      appid: 'wx1xxxxxxxxxxxx2',
    },
  }).then((data) => {
    wx.config({
      debug: false, // 开启调试模式
      appId: 'wx1xxxxxxxxx2', // 必填，公众号的唯一标识
      timestamp: data.data.data.timestamp,
      nonceStr: data.data.data.noncestr,
      signature: data.data.data.signature,
      jsApiList: ['showOptionMenu', 'chooseImage', 'previewImage'], // 必填，随意一个接口即可
      openTagList: ['wx-open-launch-weapp'], // 填入打开小程序的开放标签名
    })
    wx.ready(function (res) {
      console.log(res, '1')
    })
    wx.error(function (res) {
      console.log(res, '1')
    })
  })
    .catch((error) => { })



// 必须部署到服务器上才能有效果