vue3项目-H5页面调起微信订阅通知

直接代码 ，得在正式环境测试，本地没效果

引入js  <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js "></script>

根据情况先配置:
wx.config({
  debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
  appId: '', // 必填，公众号的唯一标识
  timestamp: , // 必填，生成签名的时间戳
  nonceStr: '', // 必填，生成签名的随机串
  signature: '',// 必填，签名
  jsApiList: [], // 必填，需要使用的JS接口列表
  openTagList: [ 'wx-open-subscribe']  // 引入公开组件
});


vue文件：
<template>
  <wx-open-subscribe
    template="一次性订阅的模板id"
    id="subscribe-btn"
  >
    <component :is="'script'" type="text/wxtag-template">
      <button style="border: none; width: 200px; height: 50px">
        一次性模版消息订阅
      </button>
    </component>
  </wx-open-subscribe>
</template>
<script>
import { onMounted, ref } from 'vue';
import { isWechat } from '@/utils';
export default {
  name: 'wxtest',
  setup() {
    onMounted(() => {
      if (isWechat()) {
      // 因为在vue里面直接用wx-open-subscribe识别不出来，得真实微信下才行
        var btn = document.getElementById('subscribe-btn');
        btn.addEventListener('success', function (e) {
          console.log('success', e.detail);
        });
        btn.addEventListener('error', function (e) {
          console.log('fail', e.detail);
        });
      }
    });
    return {};
  },
  components: {}
};
</script>