Vue中生成二维码 组件库qrcode使用
qrcode网址:
https://www.npmjs.com/package/qrcode
安装代码如下:
npm install qrcode
qrcode文档中生成二维码有很多环境下的用法。我们这里使用ES6/ES7的用法。
ES6/ES7
Promises and Async/Await can be used in place of callback function.
import QRCode from 'qrcode'
// With promises
QRCode.toDataURL('I am a pony!')
.then(url => {
console.log(url)
})
.catch(err => {
console.error(err)
})
// With async/await
const generateQR = async text => {
try {
console.log(await QRCode.toDataURL(text))
} catch (err) {
console.error(err)
}
}
图中是通过wx图片url的路径生成二维码 生成的是Promise对象 将字符串转换为二维码
————————————————
版权声明:本文为CSDN博主「编程界的冠希」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/m0_65262198/article/details/124079944
Vue中生成二维码 组件库qrcode使用的更多相关文章
- vue 中生成二维码之爬坑之路
最近在做vue中项目,有个需求是在你提交信息后把后台返给你的链接生成二维码. 一共使用了两种生成二维码的方法 1.vue-qr 这个是在一进入页面直接生成二维码,具体介绍见文档:https://www ...
- vue中生成二维码
<template> <div id="qrcode" ></div> </template> <script> imp ...
- 在java中生成二维码,并直接输出到jsp页面
在java中生成的二维码不存到磁盘里要直接输出到页面上,这就需要把生成的二维码直接以流的形式输出到页面上,我用的是myeclipse 和 tomcat 它的原理是:在加载页面时,根据img的src(c ...
- C# 动态创建SQL数据库(二) 在.net core web项目中生成二维码 后台Post/Get 请求接口 方式 WebForm 页面ajax 请求后台页面 方法 实现输入框小数多 自动进位展示,编辑时实际值不变 快速掌握Gif动态图实现代码 C#处理和对接HTTP接口请求
C# 动态创建SQL数据库(二) 使用Entity Framework 创建数据库与表 前面文章有说到使用SQL语句动态创建数据库与数据表,这次直接使用Entriy Framwork 的ORM对象关 ...
- .net在网页中生成二维码和条形码
二维码: 1.下载ThoughtWorks.QRCode.dll文件 2.创建Web项目,添加引用刚才下载的文件 3.在项目中添加aspx窗体,编写代码如下 <%@ Page Language= ...
- Vue——前端生成二维码
与后端生成二维码相比,前端生成二维码更具有灵活性,下面就介绍两种前端生成二维码的方式,两种方式相比之下,vue-qr比qrcode多了一个再中间添加logo的功能. 方式一:qrcode npm np ...
- php生成二维码,使用qrcode类库创建
传说Google有个接口,可以生成二维码,这让我有点鸡冻不已,于是,......(省略1000字).结果,我找到了另外一个方法,是使用一个php类库,该工具叫:qrcode,但下载该工具可真是要人命. ...
- QRCode生成二维码,jq QRCode生成二维码,QRCode生成电子名片
[QRCode官网]http://phpqrcode.sourceforge.net/ PHP QRCode生成二维码 官网下载QRCode源码包,引入源码包中的 qrlib.php . <?p ...
- 动态生成二维码插件 jquery.qrcode.js
前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...
- 生成二维码(jquery.qrcode.min.js插件)
生成二维码:参看GitHub资源https://github.com/jeromeetienne/jquery-qrcode 直接上代码:(都需要引入jQuery.js 1.引入(jquery.qr ...
随机推荐
- 深度掌握TypeScript中的重载【函数重载、方法重载】
深度掌握TypeScript中的重载[函数重载.方法重载] 1. 函数重载,方法重载的重要性 著名前端流行框架底层都用到函数重载,例如:Vue3 底层源码就多处使用到带泛型的函数重载.很多前端面试更是 ...
- STL常用函数
STL简介 \(STL\)是\(Standard\) \(Template\) \(Library\)的简称,中文名称为标准模板库,从根本上讲, 就是各种\(STL\)容器的集合,容器可以理解为能够实 ...
- 【已解决】【Tensorflow2.12.0版本以后合并CPU和GPU版】Tensorflow-gpu==2.12.0 安装失败解决办法
直接上解决方式,需要知道原因的看后文. 直接安装 tensroflow,从 2022 年 12 月起 tensorflow-gpu 已经合并到 tensorflow 包中了 pip install t ...
- XIAMEN_AMOY
第一份博客,就发布点轻松的内容吧 微雨的清晨 镜头向着前方 越过山丘 海 是像河一样的海 原来真的有随便抓一把都是贝壳的地方 青色,紫色,黄色 转行去做贝壳项链吧 如果不是去海边 那厦门不是一个很晒的 ...
- npm install 报-4048错误
报错原因: 有缓存 权限不够 有三种解决方法: 第一种:找到.npmrc文件并删除 在 C:\Users\自己用户的文件夹\ 下找到 .npmrc 文件并删除 注意:这个文件是隐藏的,需要显示隐藏才能 ...
- MybatisPlus条件查询方法全解
1.是什么? MybatisPlus通过条件构造器可以组装复杂的查询条件,写一些复杂的SQL语句,从而简化我们的开发提升我们的开发效率 # 可以简单的理解为就是我们写SQL语句时where后面的条件 ...
- 开源不挣钱?这个项目上线半年月入超 30w
很兴奋的告诉大家,Sealos 自从 6 月份上线以来,仅半年时间注册用户已经突破 7万,月收入超过 30w,本文来向大家介绍我们是怎么做开源商业化的.每月平均增速超过 40%,而且这些收入大部分来自 ...
- 从零玩转Docker之docker-compose-azdocker-compose
title: 从零玩转Docker之docker-compose date: 2023-04-04 17:39:40.699 updated: 2023-04-04 17:52:15.329 url: ...
- MySQL运维实战(1.1)安装部署:使用RPM进行安装部署
作者:俊达 我们在生产环境部署mysql时,一般很少使用RedHat Package Manager(RedHat软件包管理工具).用rpm或或者其他包管理器安装mysql有其好处,例如安装简单,并且 ...
- java中使用对象储存OSS
首先获取 ACCESS_KEYSECRET 与 ACCESS_KEYID 获取 ENDPOINT 与 ALI_DOMAIN 与 BUCKET_NAME(存储空间名称) 依赖 <!-- 图片 ...