js 生成barcode条形码和qrcode二维码

最新推荐文章于 2024-08-09 13:40:51 发布

晏紫苏_cc

最新推荐文章于 2024-08-09 13:40:51 发布

阅读量4k

点赞数 1

分类专栏： javascript vue 文章标签： jsbarcode qrcode js生成barcode js生成qrcode

本文链接：https://blog.csdn.net/yanzisu_congcong/article/details/96879483

版权

本文介绍了如何使用JavaScript库jsbarcode和qrcode来生成条形码和二维码。通过npm安装这两个库，然后参照提供的文档链接，可以轻松实现条形码和二维码的生成。

摘要由CSDN通过智能技术生成

1：生成条形码

npm install jsbarcode

npm install qrcode

<!-- 条形码区域 -->      
<div class="barcode center" >
  <img id="barcode">
  <div class="barcode-text">1234567890</div>
</div>
       
<!-- 二维码 -->
<canvas id="qrcode"></canvas>

import JsBarcode from 'jsbarcode'
import QRCode from 'qrcode'

export default {
  head () {
    return {
      title: ''
    }
  },
  asyncData (context) {
    let data = context.req.body.data || {}
    return {data: data}
  },
  mounted () {
    this.createBarcode()
    this.createQrcode()
  },
  methods: {
    createBarcode () {
      JsBarcode('#barcode',data.uniqueCode,{
        format: "CODE128", // 选择要使用的条形码类