vue 中生成二维码之爬坑之路

最近在做vue中项目,有个需求是在你提交信息后把后台返给你的链接生成二维码.

一共使用了两种生成二维码的方法

1.vue-qr

这个是在一进入页面直接生成二维码,具体介绍见文档:https://www.npmjs.com/package/vue-qr;

2.qrcode

这个可以,符合我的要求

tempalte:

 <canvas id="canvas" ></canvas>

script:

引入:

import VueQr from ‘qrcode‘

组件:

components: { VueQr },

在方法内使用:

var canvas = document.getElementById(‘canvas‘)
            VueQr.toCanvas(canvas, qrUrl, function (error) {
              if (error) console.error(error)
               console.log("success")
            })

 // qrUrl为后台给的链接// 最后就可以在页面上显示了

原文地址:https://www.cnblogs.com/xiao-hui-hui/p/10730459.html

时间: 2024-10-05 18:35:13

vue 中生成二维码之爬坑之路的相关文章

JAVA中生成二维码图片的方法

JAVA中生成二维码的方法并不复杂,使用google的zxing包就可以实现.下面的方法包含了生成二维码.在中间附加logo.添加文字功能. 一.下载zxing的架包,并导入项目中,如下: 最主要的包都在com.google.zxing.core下.如果是maven项目,maven依赖如下: 1 <dependency> 2 <groupId>com.google.zxing</groupId> 3 <artifactId>core</artifact

在.net core web项目中生成二维码

原文:在.net core web项目中生成二维码 1.添加QRCoder包引用 2. public IActionResult MakeQrCode()        { string url="https://www.baidu.com"; var generator = new QRCodeGenerator(); var codeData = generator.CreateQrCode(str,QRCodeGenerator.ECCLevel.M,true); var qrc

.net在网页中生成二维码和条形码

二维码: 1.下载ThoughtWorks.QRCode.dll文件 2.创建Web项目,添加引用刚才下载的文件 3.在项目中添加aspx窗体,编写代码如下 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SAOMADemo.aspx.cs" Inherits="_0729Test.SAOMADemo" %> <!DOCTYPE html&g

系统中生成二维码

平台使用方式:先将把2个DLL文件(FWFramework.Client.QRCode.dll,ThoughtWorks.QRCode.dll)拷贝到客户端目录.文件下载:http://bbs.delit.cn/forum.php?mod=attachment&aid=NjM5fDM0YmRhZGU1fDE0NDg4Njk3NjR8MHwzNzk%3D 1.生成二维码'实例化(类似NEW)dim qrcode=LoadAssembly("FWFramework.Client.QRCode

【swift】ios中生成二维码

ios开发中可以自己代码生成二维码,需要使用到一个框架 CoreImage CoreImage框架可以做滤镜,Gif动图,二维码等 先看效果图 下面直接贴上代码(OC也是下面一样的流程) 1 func createQRCode(){ 2 3 //建立一个滤镜 4 let qrFilter = CIFilter(name: "CIQRCodeGenerator") 5 //重设滤镜的初始值 6 qrFilter.setDefaults() 7 //通过KVC设置滤镜的内容(需要将字符串转

ios 中生成二维码和相册中识别二维码

iOS 使用CIDetector扫描相册二维码.原生扫描 原生扫描 iOS7之后,AVFoundation让我们终于可以使用原生扫描进行扫码了(二维码与条码皆可)AVFoundation可以让我们从设备中获取到输入流与输出流,从而获取二维码中包含的信息. 实现原生扫描非常简单.1.先导入AVFoundation框架.<AVFoundation/AVFoundation.h>2.接着设置代理,实现代理回调方法AVCaptureMetadataOutputObjectsDelegate3.然后创建

vue环境中生成二维码

代码如下: 引入qrcode--------npm install qrcode <template> <div> <div id='code'></div> <canvas id="canvas"></canvas> </div> </template> <script> import Vue from 'vue' import QRCode from 'qrcode' Vue

java生成二维码的三个工具

1.  使用SwetakeQRCode在Java项目中生成二维码 http://swetake.com/qr/ 下载地址 或着http://sourceforge.jp/projects/qrcode/downloads/28391/qrcode.zip 这个是日本人写的,生成的是我们常见的方形的二维码 可以用中文 如:5677777ghjjjjj  有朋友问我要这个图片生成的代码,我就在网上搜索然后整理了一个类,首先要把SwetakeQRCode的jar包qrcode.jar放在工程的编译路径

java生成二维码的几种方式

1: 使用SwetakeQRCode在Java项目中生成二维码 http://swetake.com/qr/ 下载地址 或着http://sourceforge.jp/projects/qrcode/downloads/28391/qrcode.zip 这个是日本人写的,生成的是我们常见的方形的二维码 可以用中文 如:5677777ghjjjjj 2: 使用BarCode4j生成条形码和二维码 BarCode4j网址:http://sourceforge.NET/projects/barcode