前端使用qrcodejs2插件实现根据网址生成二维码

news/2024/7/10 1:38:04 标签: 前端, javascript, 开发语言, vue, vue.js

实现效果:

实现方法:

1.安装插件

npm install --save qrcodejs2

2.可以全局引入,也可以只在使用的vue文件中引入

import QRCode from 'qrcodejs2';

3.在vue文件的template中设置放置二维码的div

<div id="qrcode"></div>

4.在vue文件中的method中写获取二维码的方法

getCode() {
       //    生成二维码
       var qrcode = new QRCode('qrcode', {
           text: 'http://www.baidu.com', // url
           width: 120, // 二维码宽度
           height: 120, // 二维码高度
           colorDark: '#000000', // 前景色
			colorLight: '#ffffff', // 后景色
			correctLevel: QRCode.CorrectLevel.L // 容错级别
       });
   },


http://www.niftyadmin.cn/n/5106920.html

相关文章

工程中的SOVD——从ECU到车辆

SOVD标准正在改变诊断方式&#xff0c;特别是在互联网上当多个合作方进行交互时&#xff0c;其提供了很大的优势。在开发的早期阶段&#xff0c;需要使用附加的方法来利用这个标准&#xff0c;因为该标准并不是专为ECU诊断而开发的&#xff0c;而且还需格外注意数据的处理&…

Mathematica强制将函数的自变量由符号转为数值

问题 使用Mathematcia完成函数优化&#xff08;FindMaximum&#xff09;十分方便。但是如果优化的目标函数非常复杂&#xff0c;里面嵌套了若干NSolve函数&#xff0c;那么FindMaximum可能会计算非常长时间&#xff0c;甚至无法得到正确结果。 原因在于&#xff0c;Mathemtic…

支持录音的笔记APP,可将录音转化为文字的笔记软件

提及笔记APP工具&#xff0c;无外乎是电子笔记和手写笔记&#xff0c;现如今随着科技的不断发展&#xff0c;人们使用电子设备的频率是越来越多&#xff0c;在选择笔记APP时&#xff0c;大家不想再单纯的依靠手动输入文字记录&#xff0c;反而更多的是喜欢快捷的录音添加笔记的…

用echarts在vue2中实现3d饼图

先看效果&#xff0c;再看文章&#xff1a; 一、安装插件 3d的图不仅用到echarts&#xff0c;还用到了echarts-gl&#xff0c;因此都需要安装一下哦~ npm install echarts npm install echarts-gl2.0.9 //可以指定版本&#xff0c;也可不指定二、在main.js中引入 import * …

Unity中Shader的ShadowMapping的原理(阴影)

文章目录 前言一、阴影的作用1、阴影可以增加真实度2、阴影可以提升空间感 二、阴影的生成1、现实中阴影的生成2、Unity中阴影的生成 ShadowMapping 三、ShadowMapping原理1、在 光源处添加一个相机&#xff0c;同时打开深度测试 与 写入&#xff0c;并生成ShadowMap&#xff0…

『吴秋霖赠书活动 | 第三期』《Python asyncio并发编程》

文章目录 1. 写在前面2. 浅谈asyncio3. Python asyncio并发编程 不再受限于&#xff01;asyncio异步让你的程序在高并发时翱翔自如&#xff01; 声明&#xff1a;赠书活动是博主与出版社达成合作&#xff0c;只属于粉丝的专属福利 本期书籍&#xff1a;《Python asyncio并发编程…

Pandas与数据库交互详解

Pandas 是一个强大的数据分析库&#xff0c;可以与各种数据库进行交互&#xff0c;从而可以方便地从数据库中读取数据、分析数据&#xff0c;并将结果写回数据库中。以下是使用 Pandas 与数据库交互的一般步骤&#xff1a; 一 、数据库交互 安装必要的库&#xff1a;首先&…

git仓库中增加子仓库

在 Git 中包含另一个 Git 仓库通常使用 Git 子模块&#xff08;Git Submodule&#xff09;来实现。子模块允许你在一个 Git 仓库中包含另一个 Git 仓库&#xff0c;从而在一个仓库中管理多个相关但独立的项目。 以下是如何将一个 Git 仓库包含为另一个 Git 仓库的子模块的步骤…