一、用js生成条形码这种业务场景不是很常见的,最近刚好又接到这种需求

Google一下,发现github还真有这方面的轮子,感谢github,省去了我们很多造轮子的过程,

好了言归正传,首先引入jsbarcode这个轮子(根据实测,该轮子着实好用支持多种编码方式)

npm install jsbarcode;

import jsbarcode from 'jsbarcode';

createBarcode () {
  jsbarcode('#canvas', '1421784529458125', {
  lineColor: '#000',
  width: 2,
  height: 40,
  displayValue: false
  })
}
 
 
 
二、js生成二维码这种需求还是很常见的(这里同样是介绍一个好用的包qrcode)
 
npm install qrcode
 
import qrcode from 'qrcode'
 
qrcode.toCanvas(canvas, 'sample text', function (error) {
  if (error) console.error(error)
  console.log('success!')
})

使用js生成条形码以及二维码的更多相关文章

  1. C# 利用ZXing.Net来生成条形码和二维码

    本文是利用ZXing.Net在WinForm中生成条形码,二维码的小例子,仅供学习分享使用,如有不足之处,还请指正. 什么是ZXing.Net? ZXing是一个开放源码的,用Java实现的多种格式的 ...

  2. C#利用Zxing.net生成条形码和二维码并实现打印的功能

        开篇:zxing.net是.net平台下编解条形码和二维码的工具. 下载地址:http://pan.baidu.com/s/1kTr3Vuf Step1:使用VS2010新建一个窗体程序项目: ...

  3. 使用谷歌Z生成条形码以及二维码

    下载地址:http://zxingnet.codeplex.com/ zxing.net是.net平台下编解条形码和二维码的工具,使用非常方便. 首先下载二进制dll文件,引入工程: using Sy ...

  4. iOS开发——生成条形码,二维码

    - (void)viewDidLoad { [super viewDidLoad]; self.imageView.image = [self generateBarCode:@"15248 ...

  5. ZXing生成条形码、二维码、带logo二维码

    采用的是开源的ZXing,Maven配置如下,jar包下载地址,自己选择版本下载,顺便推荐下Maven Repository <!-- https://mvnrepository.com/art ...

  6. winform生成条形码和二维码(ZXing.Net)

    首先在项目添加ZXing.Net. 工具-->Nuget包管理器-->Nuget程序包  在所搜栏输入 ZXing.Net 如下图: 添加完成后会看见: 效果图: 所有代码: /// &l ...

  7. C#Zxing.net生成条形码和二维码

    下载Zxing.net官网:https://archive.codeplex.com/?p=zxingnet 或者去VS程序包下载 封装好的代码: using System; using System ...

  8. js生成和下载二维码

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. ZXing 生成、读取二维码(带logo)

    前言 ZXing,一个支持在图像中解码和生成条形码(如二维码.PDF 417.EAN.UPC.Aztec.Data Matrix.Codabar)的库.ZXing(“zebra crossing”)是 ...

随机推荐

  1. JavaScript 编程艺术-第4章(JavaScript美术馆)代码

    功      能:在同一个网页上切换显示不同的图片与文本(*亲测可用) 使用属性: a) document.getElementById(" ") ——返回一个与给定的id属性值的 ...

  2. Lightoj 1090 - Trailing Zeroes (II)

    题目连接: http://www.lightoj.com/volume_showproblem.php?problem=1090 题目大意: 给出n,r,p,q四个数字1<=n,r,p,q< ...

  3. ACM配置指南

    Ubuntu桌面入门指南 ACM比赛系统ubuntu 使用指南 ACM核武器 简明 Vim 练级攻略 Vim命令合集 代码编辑神器VIM(附我写acm程序时的配置) my_vimrc in ubunt ...

  4. 题解报告:hdu 1220 Cube

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1220 问题描述 Cowl擅长解决数学问题. 有一天,一位朋友问他这样一个问题:给你一个边长为N的立方体 ...

  5. java getDocumentBase() 得到的文件夹路径

    参考一个百度知道上的回答 举例说来,假设你的项目文件是xx,而这个xx文件夹是在D盘下的yy文件夹里,即项目文件的完整路径D:\yy\xx,则编译运行文件后,在xx文件夹里会产生名为build的文件夹 ...

  6. mac下 netbeans 8.02中文版设置代码自动补齐 + eclipse自动补齐

    netbeans自带的自动补齐快捷键是commad+\ 我想要的是在输入的时候,有自动提示,找了半天也没找到怎么搞. 因为我是用的mac系统 后来参考其他的设置,找到了设置的方法,把这个方法记录一下. ...

  7. selenium 延迟等待的三种方式

    1.最直接普通的方式:这个是设置固定的等待时间    Thread.sleep(1000);   2.显示等待方式(Explicit Wait):就是明确的要等待的元素在规定的时间之内都没找到,那么就 ...

  8. AJPFX解析成员变量和局部变量

    成员变量和局部变量 3.1.成员变量和局部变量 A:在类中的位置不同         * 成员变量:在类中方法外         * 局部变量:在方法定义中或者方法声明上 B:在内存中的位置不同   ...

  9. vue组件、数据解析的实现思想猜想与实践

    Vue的全局组件,在注册后,可在全局范围内无限次使用,猜想是利用了闭包"可以保持形参"的特性,使初始化时的作用域得意保存,下面用原生js和部分jquery代码模拟了数据解析和组件渲 ...

  10. 平衡图片负载,提升web站点访问体验

    最近给分公司做官方网站,内网测试一切ok,发布至云端后,体验惊人——公司外网网速渣渣(十几k~几十k),更加要命的是,网站的高清图,根本就加载不出来,几秒,十几秒过去了,仍然在转圈圈,如下图... 于 ...