Vue プロジェクトでの支払い機能の実装 (WeChat 支払いと Alipay 支払い)

 支払う(){
      スイッチ(this.radio){
        ケース '3':
        this.yuer();
        壊す;
        ケース '1':
        this.zhifubao();
        ケース '0':
        this.getWechatCode();
      }
    },
   志福宝（）{
     支払いByZhifubao(
       {
         OutTradeNo:'Oct20200909095646265303127', // 販売者の注文番号。販売者の Web サイトの注文システムで唯一の注文番号です。必須です。販売者側は一意である必要があります。
          件名:「モバイル ウェブサイト支払いテスト」、//トピック製品コード:「QUICK_WAP_WAY」、
          body: "モバイル ウェブサイトの支払い説明情報", //製品の説明、オプション TotalAmount: 20 //支払い金額、必須}
     ).then(res=>{
       コンソールログ(res);
        （res.code === 201）の場合{
            // vuex にデータを保存します // this.$store.dispatch('addAliFrom', res.data.data)
            this.html = res.data;
            var フォーム = res.data;
            div 要素を document.createElement("div");
            div.innerHTML = form; //ここでformはバックグラウンドによって返されるデータです。document.body.appendChild(div);
            ドキュメント.フォーム[0].送信();
            //これを返します。$router.push('/aliPay')
          } それ以外 {
            アラート(res.data.msg)を返します。
          }
     })
    },

 <div id="wechatcode" v-loading="読み込み中"
element-loading-text="読み込み中"
要素読み込みスピナー="el-icon-loading"
要素読み込み背景="rgba(0, 0, 0, 0.8)">
</div>

import QRCode from 'qrcodejs2' // qrcodeをインポート

取得Wechatコード() {
                モデル
                    .getModel("wechatpay")
                    。得る（{
                        注文ID:this.注文ID
                    })
                    .then(res => {
                        （res.data.code == 200）{
                            this.wechatPayUrl = res.data.resultData
                            if(!this.flag){
                            // 重要なポイントはここにあり、残りはスイッチングビジネスロジックとインターフェース用です。let wechatcode = new QRCode('wechatcode', {
                                    幅: 200,
                                    高さ: 200,
                                    text: this.wechatPayUrl, // QRコードアドレス colorDark: "#000",
                                    カラーライト: "#fff",
                                })
                            }
                            this.flag = true
                            this.loading = false
                            this.isWechatCodeShow = true
                        }
                    })
        },

マウント() {
        this.getWechatCode()
        //ポーリングを実装する this.interval = window.setInterval(() => {
        タイムアウトを設定します(this.getOrderStatus(), 0);
        }, 3000);
        
    },
    破棄する前に() {
        // ポーリングをクリアする clearInterval(this.interval)
        this.interval = null
    },