H5 使用jsBarcode qrcodejs 生成二维码 条形码

简介: H5 使用jsBarcode qrcodejs 生成二维码 条形码

jsBarcode:

https://lindell.me/JsBarcode/#

qrcodejs:

https://github.com/davidshimjs/qrcodejs

HTML

         <div id="qrcode" ref="qrcode" style="margin: 10px;"></div>  
         <svg id="barcode"></svg> 

script

<script src="js/qrcode.js"></script>
<script src="js/jsbarcode.js"></script>

JS

methods: {
    qrCode (url) {
           // 二维码
            let qrcode = new QRCode('qrcode', {
                width: 180, 
                height: 180,    
                correctLevel : QRCode.CorrectLevel.H     
            })    
            qrcode.clear() //清除二维码 
            qrcode.makeCode(url) //生成另一个新的二维码
            // 条形码
            JsBarcode("#barcode", url,{ 
              height: 50,
              width: 2.2,
              fontSize: 14
            });
        }
       },
        mounted () {
          this.qrCode('123456789')
        }

效果:

image.png

相关文章
|
4天前
|
自然语言处理
二维码美化指南:从Logo到文字,轻松制作专属二维码
草料二维码提供基础的二维码美化设置,包含Logo、颜色、码点码眼、容错、添加文字等设置。
|
4天前
|
Python
生成二维码
使用Python生成二维码可借助`qrcode`库。安装库:`pip install qrcode[pil]`。创建二维码的步骤如下: ```python import qrcode
35 0
|
4天前
uniapp生成条形码?
uniapp生成条形码?
|
8月前
使用jsbarcode生成条形码
使用jsbarcode生成条形码
86 0
|
10月前
|
Java Maven
让一句话生成一张二维码图片
让一句话生成一张二维码图片
|
边缘计算 并行计算 算法
Opencv+ZBar识别条形码、二维码
Opencv+ZBar识别条形码、二维码
612 0
Opencv+ZBar识别条形码、二维码
|
移动开发
H5 使用jsBarcode qrcodejs 生成二维码 条形码
H5 使用jsBarcode qrcodejs 生成二维码 条形码
H5 使用jsBarcode qrcodejs 生成二维码 条形码
|
程序员 C# 图形学
C# 生成二维码,彩色二维码,带有Logo的二维码及普通条形码
每次写博客,第一句话都是这样的:程序员很苦逼,除了会写程序,还得会写博客!当然,希望将来的一天,某位老板看到此博客,给你的程序员职工加点薪资吧!因为程序员的世界除了苦逼就是沉默。我眼中的程序员大多都不爱说话,默默承受着编程的巨大压力,除了技术上的交流外,他们不愿意也不擅长和别人交流,更不乐意任何人走进他们的内心!    废话少说,咱直接进入正题:    目前来说,比较流行的二维码生成方式有两种:一种是:QrCode.Net和谷歌的Zxing.Net,我个人比较倾向于使用ZXing.Net,今天本篇博客主要讲解Zxing.Net的使用。
1896 0
QRCode二维码生成方案及其在带LOGO型二维码中的应用(1)
原文:QRCode二维码生成方案及其在带LOGO型二维码中的应用(1) 提要:很多公司为商业宣传之需,常将企业LOGO加入二维码中,但如果LOGO遮挡区域足够地大,二维码就变得无法识别。
1495 0