当前位置: 首页 > news >正文

vue生成二维码跳转到小程序

参考

https://blog.csdn.net/qq_51678620/article/details/121397610
https://blog.csdn.net/blue__k/article/details/125410448
 

 this.$nextTick(()=>{// new qrcode(this.$refs.qrCodeDiv, {//     text: "https://www.aiitss.cn/member?id="+id,//二维码链接,参数是否添加看需求//     width: 300,//二维码宽度//     height: 300,//二维码高度//     colorDark: "#333333", //二维码颜色//     colorLight: "#ffffff", //二维码背景色//     // correctLevel: qrcode.CorrectLevel.L //容错率,L/M/H//   });// })// var qrcode = new qrcode(this.$refs.qrCodeUrl, {//   text: "https://www.aiitss.cn/member?id="+id, // 需要转换为二维码的内容//   width: 200,//   height: 200,//   typeNumber: -1, //计算模式//   correctLevel: 2, //二维码纠错级别//   colorDark: "#000000",//   colorLight: "#ffffff",// });

两种方法,但是我这么老是报错缺少东西,就舍弃一些属性(还是最初的原始版本好用)

<el-button type="primary"  plain icon="el-icon-s-grid" size="small" @click="showCode(scope.row.id)">生成二维码</el-button><el-dialog:visible.sync="dialogVisible"title="二维码(有效期30分钟)"width="400px"append-to-body><qrcoderef="qrcode"style="margin-left:30px":url="url":wid="qrcodeW":hei="qrcodeW":imgwid="30":imghei="30"></qrcode><br><el-button type="text" @click="refreshQRCode"  style="margin-left:30px;color:#13ce66;font-size:15px">重新生成二维码</el-button></el-dialog>generateQRCode(id) {this.token=getToken()this.url= "https://www.aiitss.cn/member?id="+id+'&token='+this.token;//不需要加token验证this.url= "https://www.aiitss.cn/member/?id="+id;refreshQRCode() {this.dialogVisible=falsesetTimeout(() => {this.showCode()}, 980);},showCode(id){this.dialogVisible=truethis.id = idthis.generateQRCode(id)},

效果图

小程序开发平台设置:允许普通链接跳转小程序,并设置链接样式

问题:根据规则生成了链接,pc端也生成了二维码,但是扫码却不能跳转到小程序该有的页面。有时纯空白,有时ruoyi。

后期补充解答:在测试时应该选择体验版发布小程序,测试范围也选择体验版。此时,只有手动填写进去的测试链接能成功跳转。

想要动态匹配参数,需要将小程序转成开发版发布 。

就上面这个结论,翻遍了官网答疑才找到,已测试使用,是真的。 为后来的网友留个答案。

相关文章:

  • 每日练题(py,c,cpp).6_19,6_20
  • python-录音文件转换成文字
  • 智谱API调用
  • Apollo9.0 PNC源码学习之Routing模块
  • Linux top 命令使用教程
  • 【单片机毕业设计选题24018】-基于STM32和阿里云的农业大棚系统
  • 思科配置路由器,四台主机互相ping通
  • 在Android Studio中将某个文件移出Git版本管理
  • 命令行脚本批量转换工具说明
  • 设置浏览器互不干扰
  • 【Android面试八股文】odex了解吗?解释型语言和编译型语言有什么区别?JAVA是编译型语言还是解释型语言?
  • 逻辑回归(Logistic Regression)及其在机器学习中的应用
  • 从移动、桌面端到AR/VR:HOOPS Visualize如何实现卓越的3D模型可视化?
  • 手写方法实现整型例如:123与字符串例如:“123“相互转化(下篇)
  • Django REST framework序列化器详解:普通序列化器与模型序列化器的选择与运用
  • Android Studio:GIT提交项目到远程仓库
  • iOS仿今日头条、壁纸应用、筛选分类、三方微博、颜色填充等源码
  • java 多线程基础, 我觉得还是有必要看看的
  • JAVA多线程机制解析-volatilesynchronized
  • NSTimer学习笔记
  • React+TypeScript入门
  • Spark VS Hadoop:两大大数据分析系统深度解读
  • SQL 难点解决:记录的引用
  • Vim Clutch | 面向脚踏板编程……
  • VUE es6技巧写法(持续更新中~~~)
  • 测试开发系类之接口自动化测试
  • 构造函数(constructor)与原型链(prototype)关系
  • 缓存与缓冲
  • 记录:CentOS7.2配置LNMP环境记录
  • 那些被忽略的 JavaScript 数组方法细节
  • 我有几个粽子,和一个故事
  • 项目实战-Api的解决方案
  • 通过调用文摘列表API获取文摘
  • # 数仓建模:如何构建主题宽表模型?
  • #DBA杂记1
  • #NOIP 2014#Day.2 T3 解方程
  • (9)STL算法之逆转旋转
  • (done) 声音信号处理基础知识(4) (Understanding Audio Signals for ML)
  • (java)关于Thread的挂起和恢复
  • (javaweb)Http协议
  • (NO.00004)iOS实现打砖块游戏(十二):伸缩自如,我是如意金箍棒(上)!
  • (附源码)springboot宠物管理系统 毕业设计 121654
  • (附源码)ssm本科教学合格评估管理系统 毕业设计 180916
  • (附源码)ssm经济信息门户网站 毕业设计 141634
  • (含react-draggable库以及相关BUG如何解决)固定在左上方某盒子内(如按钮)添加可拖动功能,使用react hook语法实现
  • (十一)手动添加用户和文件的特殊权限
  • (正则)提取页面里的img标签
  • (转)Android学习笔记 --- android任务栈和启动模式
  • (转)四层和七层负载均衡的区别
  • (转)真正的中国天气api接口xml,json(求加精) ...
  • (轉貼) 2008 Altera 亞洲創新大賽 台灣學生成果傲視全球 [照片花絮] (SOC) (News)
  • *Django中的Ajax 纯js的书写样式1
  • .[backups@airmail.cc].faust勒索病毒的最新威胁:如何恢复您的数据?
  • .a文件和.so文件
  • .bat批处理(八):各种形式的变量%0、%i、%%i、var、%var%、!var!的含义和区别