1、首先在 登录 微信公众号-小程序-开发-开发设置 找到 ‘扫普通链接二维码打开小程序’,然后添加配置。
2、配置成功后,在PC端写一个按钮,点击按钮根据链接与参数生成二维码图片
<button type="default" @click="transmit">点击生成二维码</button> <div class="erweima" id="qrcode" ref="qrcode"></div>
3、链接生成二维码使用的是qrcodejs2,需要安装并引入,同时引入jquery
npm install qrcodejs2 --save
import QRCode from "qrcodejs2";
import $ from "jquery"
4、JS 中
methods: { transmit(){ if (this.$refs.qrcode.title != \'\') { $(\'#qrcode\').html("") }this.qrcode(\'小红\', 18); }, qrcode(e, n) { let qrcode = new QRCode("qrcode", { width: 200, // 二维码宽度,单位像素 height: 200, // 二维码高度,单位像素 text: "https://api.zhiyedang.cn/a?=" + e + "&" + n // 生成二维码的链接 }); }, }
到这里,点击按钮就能生成二维码了,用微信扫二维码也能跳到小程序指定页面了
注意(这个功能默认跳转到线上的小程序,如果想要跳转到体验版,第一步 测试链接里面的二维码规则,和PC端二维码链接的格式需要一致,否则跳进去报错400)
微信小程序中
app.js 中
onLaunch: function () { var that = this ; if(JSON.stringify(options.referrerInfo)!=\'{}\'){ that.globalData.name=options.referrerInfo.extraData.name; that.globalData.age=options.referrerInfo.extraData.age; } },
globalData: { name:\'\', age:\'\', }
扫描后跳转的小程序页面 中 获取参数
data: { name: \'\', age: \'\' },
onLoad: function (options) { var name var age if (JSON.stringify(options)==\'{}\') { name = app.globalData.name age = app.globalData.age this.setData({ name: name, age: age }) return } let url = decodeURIComponent(options.q) let data = url.split(\'=\')[1] name = data.split(\'&\')[0] age = data.split(\'&\')[1] this.setData({ name: name, age: age }) },
到这里就算完成了
请发表评论