pc和h5生成二维码跳转到微信小程序

pc和h5生成二维码跳转到微信小程序

先使用qrcode生成二维码，绑定对应链接,分别引入qrcode插件

 

pc:

  <div class="codeDes">微信扫描二维码跳转</div>
             <div id="qrcode"></div>

$('#qrcode').qrcode({width: 64,height: 64,correctLevel:0,text: "https://wap.BalleMax.com/miniprogram?action=go&customerNo="+that.customerNo+"&orderId="+that.orderId+"&apexId="+that.apexId});
//动态绑定对应二维码

H5:

        <div class="recommendedNumber">长按或保存二维码</div>
        <div class="qrCode">
            <vue-qr
                :size="300"
                class="erweima"
                :text="appSrc">
            </vue-qr>
        </div>

   // 拼接网址。
            spellUrl() {
                //todo 生产环境改为https
                this.appSrc = "https://wap.BalleMax.com/miniprogram?action=go&customerNo="+this.customerNo+"&orderId="+this.orderId+"&apexId="+this.apexId;
                console.log("paths: " + this.appSrc)
            }

---

像上面这样二维码和参数都是生成好了，但是要注意，想让二维码正确小程序，必须在微信公众平台配置对应参数：

如果想动态传参，必须要在https://wap.BalleMax.com/原链接后面跟随miniprogram?action=go（这里我是随便取的，你也可以aaa?bb=c）然后将再连接之后需要的参数，使用&customerNo=111&orderId=222就可以（&参数名=值）

注意：开发环境每测试一条不同参数的二维码，都需要在测试链接里面添加一条新的，目前只能存在五条测试链接，当然是可以删除重新添加的喔。

到上线的时候建议先发一版测试，别忘配置二维码跳转规则，先测一下，正常情况下是可以动态跳转的。

如果有帮助到你，可以给我一颗小心心吗~