qrcode插件-生成二维码

安装

yarn add qrcodejs2 --save 
npm install qrcodejs2 --save 

使用

<template><div><div id="qrcodeImg"></div><!-- 创建一个div,并设置id --></div>
</template>
<script>
import QRCode from 'qrcodejs2'; // 引入qrcode
export default{mounted() {new QRCode('qrcodeImg', {width:160,height:160,text: this.$store.state.userForm.userInf.member_num, // 二维码内容});}
}
</script>
  • text:二维码扫描展示信息(默认:无)

  • width:二维码宽度(默认:256)

  • height:二维码高度(默认:256)

  • colorDark:二维码颜色(默认:#000000)

  • colorLight:二维码背景色(默认:#ffffff)

  • correctLevel:二维码容错级别,可设置为:QRCode.CorrectLevel.L、QRCode.CorrectLevel.M、QRCode.CorrectLevel.Q、QRCode.CorrectLevel.H(默认:QRCode.CorrectLevel.L)

  • clear():二维码清除方法

注意:如果将生成二维码逻辑放到弹窗中,那么二维码在生成时弹窗元素还未完全渲染,此时会找不到渲染对象而生成失败,这种情况可以使用$nextTick()函数将二维码生成代码放到$nextTick()的回调函数里来解决。

this.$nextTick(() => {new QRCode('qrcodeImg', {width:160,height:160,text: this.$store.state.userForm.userInf.member_num, // 二维码内容});
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/771333.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

利用Python和IP技术实现智能旅游情报系统

文章目录 引言一、系统架构设计1. 数据采集模块2. 数据处理模块3. 用户界面模块 二、数据获取技术应用三、系统功能展示四、亮数据采集工具介绍五、总结六、号外 引言 随着旅游行业的不断发展&#xff0c;人们对旅游信息的需求也越来越大。为了帮助旅行者更好地规划行程&#…

Nodejs沙盒逃逸

Buffer 在较早一点的node.js版本中 (8.0 之前)&#xff0c;当 Buffer 的构造函数传入数字时, 会得到与数字长度一致的一个 Buffer&#xff0c;并且这个 Buffer 是未清零的。8.0 之后的版本可以通过另一个函数 Buffer.allocUnsafe(size) 来获得未清空的内存。 注&#xff1a;关…

P1219八皇后 (典DFS)

注意&#xff1a; 数组大小要开够&#xff0c;数据范围是6到13&#xff0c;要开到20&#xff0c;不然开到15数据点没法全部过。 代码&#xff1a; #include<algorithm> #include<iostream> #include<cstring> #include<queue>using namespace std;i…

Rocket mq

搭建服务【有2个】 一个是NameServer还有一个是Broker&#xff0c;要两个服务协同 后台启动服务 允许服务端自己创建topic&#xff0c;如果客户端传来的topic没有的话 然后搞个rocket mq的仪表盘&#xff0c;application.yml改成自己的地址【只需要指定NameServer的地址&#…

更灵活的定位内存地址的方法

文章目录 更灵活的定位内存地址的方法and和or指令关于ASCII码以字符形式给出的数据大小写转换的问题[bxidata]用[bxidata]的方式进行数组的处理SI和DI[bxsi]和[bxdi][bxsiidata]和[bxdiidata]不同的寻址方式的灵活应用题目示例 更灵活的定位内存地址的方法 and和or指令 1&…

Axure RP 8中文---快速原型设计工具,一站式解决方案

Axure RP 8是一款专业的快速原型设计工具&#xff0c;以其直观易用的界面和丰富的功能受到广大用户的青睐。它支持用户通过拖放操作快速创建交互式原型&#xff0c;包括线框图、流程图等&#xff0c;并具备高保真度的设计能力。Axure RP 8还提供了团队协作和共享功能&#xff0…

【Java程序设计】【C00368】基于(JavaWeb)Springboot的箱包存储系统(有论文)

TOC 博主介绍&#xff1a;java高级开发&#xff0c;从事互联网行业六年&#xff0c;已经做了六年的毕业设计程序开发&#xff0c;开发过上千套毕业设计程序&#xff0c;博客中有上百套程序可供参考&#xff0c;欢迎共同交流学习。 项目简介 项目获取 &#x1f345;文末点击卡片…

基于nodejs+vue铁路订票管理系统python-flask-django-php

该铁路订票管理系统采用前后端分离进行设计&#xff0c;并采用nodejs语言以及express框架进行开发。本系统主要设计并完成了用户登录管理过程、个人信息修改、用户管理、火车类型管理、火车信息管理、车票预订管理、车票退票管理、系统管理等功能。该系统操作简单&#xff0c;界…

13_Linux内核配置选项

内核配置选项 内核配置通常是对内核支持的各个功能进行取舍配置&#xff0c;将配置的方案保存到 configure文件中。在编译内核的时候&#xff0c;就会根据此配置对内核进行取舍编译。 编译内核之前要先配置。为了正确、合理地设置内核编译配置选项&#xff0c;从而只编译系统需…

BM85 验证IP地址(字符串)

import java.util.*;public class Solution {/*** 代码中的类名、方法名、参数名已经指定&#xff0c;请勿修改&#xff0c;直接返回方法规定的值即可** 验证IP地址* param IP string字符串 一个IP地址字符串* return string字符串*/public boolean isIPv4(String IP){//没有.i…

单片机入门到精通:一站式在线学习平台!

介绍&#xff1a;单片机&#xff0c;也称为微控制器&#xff08;MCU&#xff09;&#xff0c;是一种集成了中央处理器&#xff08;CPU&#xff09;、随机存储器&#xff08;RAM&#xff09;、只读存储器&#xff08;ROM&#xff09;以及输入/输出接口于单一芯片上的微型计算机。…

11.测试教程-自动化测试selenium-3

文章目录 1.unittest框架解析2.批量执行脚本2.1构建测试套件2.2用例的执行顺序2.3忽略用例执行 3.unittest断言4.HTML报告生成5.异常捕捉与错误截图6.数据驱动 大家好&#xff0c;我是晓星航。今天为大家带来的是 自动化测试selenium第三节 相关的讲解&#xff01;&#x1f600…

2024年大模型面试准备(三):聊一聊大模型的幻觉问题

节前&#xff0c;我们组织了一场算法岗技术&面试讨论会&#xff0c;邀请了一些互联网大厂朋友、参加社招和校招面试的同学&#xff0c;针对大模型技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何备战、面试常考点分享等热门话题进行了深入的讨论。 合集在这…

羊大师羊奶靠谱么?信誉与持续见证,共筑信赖之选

羊大师羊奶靠谱么&#xff1f;信誉与持续见证&#xff0c;共筑信赖之选 在如今注重健康饮食的时代&#xff0c;羊奶以其丰富的营养价值和独特的风味&#xff0c;逐渐受到了消费者的青睐。在众多羊奶品牌中&#xff0c;羊大师羊奶以其出色的品质、良好的信誉和持续的创新精神&a…

关于「技术开发技能」课程

本课程分为三个部分&#xff0c;带您了解如何使用大模型平台、如何训练与部署大模型及生成式AI产品应用与开发&#xff0c;您将能了解各类服务的优势、功能、典型使用案例、技术概念和成本。 学习任选的两个课程模块&#xff0c;并通过测验者&#xff0c;将授予「技术开发技能…

隆道分享AI技术应用实践 以AI赋能采购业务管理

2024年3月21日-22日&#xff0c;以“面向务实的数字化”为主题的“第12届医药健康行业数字化高峰论坛”在上海举办。本届大会聚焦项目建设、技术创新与应用、新业务模式及收效等话题&#xff0c;探讨AI制药与大模型应用&#xff0c;分享智能化技术在多领域的落地案例。隆道公司…

情感视频素材从哪里找?推荐情感视频素材分享

随着时代变化短视频的兴起&#xff0c;人们越来越喜欢用视频来表达自己的情感和经历。为了满足创作者对于情感视频素材的需求&#xff0c;以下列出了几个素材分享网站&#xff0c;帮助你更好地创作和传达情感&#xff0c;引起大家的共鸣。 蛙学网 作为一家国内知名的素材分享…

python能做什么

python能做什么 Web开发&#xff1a;Python具有许多流行的Web框架&#xff0c;如Django和Flask&#xff0c;使得它成为Web开发的首选语言。它简洁、易于学习、且拥有丰富的生态系统&#xff0c;能够快速构建高性能的Web应用。 数据科学和机器学习&#xff1a;Python在数据科学…

Webpack部署本地服务器

Webpack部署本地服务器 目录 Webpack部署本地服务器目的认识模块热替换&#xff08;HMR&#xff09;什么是 HMRHMR 通过如下几种方式, 来提高开发的速度如何使用 HMRhost 配置 目的 完成自动编译 常用方式: webpack-dev-server webpack-dev-server 是一个用于开发环境的 Web 服…

动态规划,二维DP

文章目录 1、摆花2、异或选数3、数字三角形 1、摆花 分析&#xff1a; 输入2 4 3 2 的情况下&#xff0c;只有 (2,2) , (3,1) 这两种方案。 所以&#xff0c;设置状态 dp[i][j] 表示到第 i 种花&#xff08;共 n 种花&#xff09;、第 j 个位置&#xff08;共 m 个位置&#xf…