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.rhkb.cn/news/286598.html

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

相关文章

一篇文章,告别Flutter状态管理争论,问题和解决

起因 每隔一段时间&#xff0c;都会出现一个新的状态管理框架&#xff0c;最近在YouTube上也发现了有人在推signals, 一个起源于React的状态管理框架&#xff0c;人们总是乐此不疲的发明各种好用或者为了解决特定问题而产生的方案&#xff0c;比如Bloc, 工具会推陈出新&#x…

AI基础知识扫盲

AI基础知识扫盲 AIGCLangchain--LangGraph | 新手入门RAG&#xff08;Retrieval-Augmented Generation&#xff09;检索增强生成fastGPT AIGC AIGC是一种新的人工智能技术&#xff0c;它的全称是Artificial Intelligence Generative Content&#xff0c;即人工智能生成内容。 …

关于SpringMVC返回JSON中时间对象序列化的问题

系列文章目录 文章目录 系列文章目录前言前言 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站,这篇文章男女通用,看懂了就去分享给你的码吧。 首先要说明一点,SpringMVC进行JSON序列化处理时,使用的工具包是Jackson…

PointNet++论文复现(一)【PontNet网络模型代码详解 - 分类部分】

PontNet网络模型代码详解 - 分类部分 专栏持续更新中!关注博主查看后续部分! 分类模型的训练: ## e.g., pointnet2_ssg without normal features python train_classification.py --model pointnet2_cls_ssg --log_dir pointnet2_cls_ssg python test_classification.py…

云电脑火爆出圈,如何选择和使用?--腾讯云、ToDesk云电脑、青椒云使用评测和攻略

前言&#xff1a; Hello大家好&#xff0c;我是Dream。在当下&#xff0c;科技的飞速发展已经深入影响着我们的日常生活&#xff0c;特别是随着物联网的兴起和5G网络的普及&#xff0c;云计算作为一个重要的技术概念也逐渐走进了我们的视野。云计算早已不再是一个陌生的名词&am…

Mysql配置autocommit实际使用(慎用)

以下内容都是基于MySQL5.7。所有操作建议在MySQL客户端执行。navicat可能会先意想不到的问题 在导入频繁执行update、insert的时候&#xff0c;可以考虑关闭MySQL的自动提交 首先查询当前的状态 1开启 0关闭 select autocommit;设置本次连接关闭自动提交(如果需要永久关闭请修…

MySQL的安装

第一步 先下载MySQL 的压缩包 官网链接: 点击跳转MySQL官网 或者直接下载我所上传的压缩包MySQL8.0.20X64 第二步 将下载的文件解压&#xff0c;我的解压位置为E:\Program Files目录&#xff0c;大家可以根据自己的需求解压到不同位置。如下图 第三步 进入到E:\Program Files…

导演、音乐家、艺术家眼中的Sora第一印象

自从2月16日Sora发布的那个夜晚以来&#xff0c;多少人都在翘首以盼&#xff0c;期待能真正的用上Sora。但是OpenAI自己也懂&#xff0c;基于模型对齐问题、安全问题、推理算力问题等等&#xff0c;这玩意短期内&#xff0c;基本不可能放出来给大众用。当然了&#xff0c;等以后…

【Linux】进程的基本概念(进程控制块,ps命令,top命令查看进程)

目录 01.进程的基本概念 程序与进程 进程的属性 02.进程控制块&#xff08;PCB&#xff09; task_struct的内容分类 组织进程 03.查看进程 ps命令 top指令 在计算机科学领域&#xff0c;进程是一项关键概念&#xff0c;它是程序执行的一个实例&#xff0c;是操作系统的…

如何保证缓存与数据库的双写一致性?

如何保证缓存与数据库的双写一致性&#xff1f; 概述同步策略更新缓存还是删除缓存&#xff1a;先操作数据库还是缓存&#xff1a;案例一、先删除缓存&#xff0c;在更新数据库案例二 先操作数据库&#xff0c;再删除缓存 延时双删策略&#xff08;不推荐&#xff09;使用分布式…

《数据安全技术 数据分类分级规则》及典型行业标准指南要点提炼

数据分类分级发布新国标 千呼万唤&#xff0c;国家标准GB/T 43697-2024《数据安全技术 数据分类分级规则》于3月21日正式发布。作为全国网络安全标准化技术委员会更名后&#xff0c;发布的第一部以“数据安全技术”命名的国家标准&#xff0c;《数据安全技术 数据分类分级规则…

K8s+Nacos实现应用的优雅上下线【生产实践】

文章目录 前言一、环境描述二、模拟请求报错三、配置优雅上下线1.修改nacos配置2.修改depolyment配置3.重新apply deployment后测试4.整体(下单)测试流程验证是否生效 四、期间遇到的问题 前言 我们在使用k8s部署应用的时候&#xff0c;虽然k8s是使用滚动升级的&#xff0c;先…

【CXL协议-事务层之CXL.cache (3)】

3.2 CXL.cache 3.2.1 概述 CXL.cache 协议将设备和主机之间的交互定义为许多请求&#xff0c;每个请求至少有一个关联的响应消息&#xff0c;有时还有数据传输。 该接口由每个方向的三个通道组成&#xff1a; 请求、响应和数据。 这些通道根据其方向命名&#xff0c;D2H&…

【笔记】深入理解JVM机制

&#x1f3a5; 个人主页&#xff1a;Dikz12&#x1f4d5;格言&#xff1a;吾愚多不敏&#xff0c;而愿加学欢迎大家&#x1f44d;点赞✍评论⭐收藏 目录 JVM 运⾏流程图 JVM 中内存区域划分 方法区 / 元数据区 堆 栈 程序计数器 本地方法栈 内存区域总结 JVM 中类加载过程 …

Go第三方框架--gin框架(一)

序言 Gin框架作为go语言使用最多的web框架&#xff0c;以其快速的响应速度和对复杂http路由配置的支持受到程序员和媛们的喜爱&#xff0c;几乎统治了web市场。但作为一名合格的程序员&#xff0c;要知其然更要知其所以然&#xff0c;不然八股文背的也没有啥意思。本着这个原则…

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

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

【MySQL数据库】数据类型和简单的增删改查

目录 数据库 MySQL的常用数据类型 1.数值类型&#xff1a; 2.字符串类型 3.日期类型 MySQL简单的增删改查 1.插入数据&#xff1a; 2.查询数据&#xff1a; 3.修改语句&#xff1a; 4.删除语句&#xff1a; 数据库 平时我们使用的操作系统都把数据存储在文件中&#…

3.3 数据定义 数据库与系统概论

目录 3.3.1 模式的定义与删除 1. 定义模式 2. 删除模式 CASCADE&#xff08;级联&#xff09; RESTRICT&#xff08;限制&#xff09; 3.3.2 基本表的定义、删除与修改 表的定义 2.数据类型 3. 模式与表 4. 修改基本表 5. 删除基本表 3.3.3 索引的建立与删除 1. …

如何备考2024年AMC10:吃透2000-2023年1250道真题(限时免费送)

我们今天继续来随机看5道AMC10真题&#xff0c;以及详细解析&#xff0c;这些题目来自1250道完整的官方历年AMC10真题库。通过系统研究和吃透AMC10的历年真题&#xff0c;参加AMC10的竞赛就能拿到好名次。即使不参加AMC10竞赛&#xff0c;掌握了这些知识和解题思路后初中和高中…

2015年认证杯SPSSPRO杯数学建模C题(第一阶段)荒漠区动植物关系的研究全过程文档及程序

2015年认证杯SPSSPRO杯数学建模 C题 荒漠区动植物关系的研究 原题再现&#xff1a; 环境与发展是当今世界所普遍关注的重大问题, 随着全球与区域经济的迅猛发展, 人类也正以前所未有的规模和强度影响着环境、改变着环境, 使全球的生命支持系统受到了严重创伤, 出现了全球变暖…