微信公众号网页跳转小程序，通过wx-open-launch-weapp

首先拿到授权

import wx from 'weixin-js-sdk'
wx.config({
     
  debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
  appId: appId, // 必填，公众号的唯一标识
  timestamp: timestamp, // 必填，生成签名的时间戳
  nonceStr: nonce, // 必填，生成签名的随机串
  signature: signature, // 必填，签名
  openTagList: ['wx-open-launch-weapp'] // 可选，需要使用的开放标签列表，例如['wx-open-launch-app']
})

然后写个按钮，引一下文件（//res.wx.qq.com/open/js/jweixin-1.6.0.js）

<template>
  <div class="home">
    <wx-open-launch-weapp
      id="launch-btn"
      username="gh_"
      @launch="handleLaunchFn"
      @error="handleErrorFn"
    >
      <script type="text/wxtag-template">
        <style>.btn {
      display: flex;align-items: center; }</style>
        <button class="wx-btn">跳转小程序</button>
      </script>
    </wx-open-launch-weapp>
  </div>
</template>

<script src="//res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
export default {
     
  data () {
     
    return {
     
    }
  },
  mounted () {
     
  },
  methods: {
     
    handleLaunchFn (e) {
     
      console.log(e)
    },
    handleErrorFn(e){
     
      console.log('fail', e.detail);
    }
  }
}
</script>

亲测有效

注意点

1. 开发者工具按钮是显示不出来的，用真机
2. 注意官方的版本要求，微信版本要求为：7.0.12及以上。 系统版本要求为：iOS 10.3及以上、Android 5.0及以上。