vue 项目 生成条形码

下载:

npm i jsbarcode

实现:

<template>
    <div>
        <img id="barcode" />
    </div>
</template>
<script>
import JsBarcode from 'jsbarcode'
mounted() {
    this.renderBarcode()
  },
 methods: {
    renderBarcode() {
      this.$nextTick(() => {
        JsBarcode('#barcode', this.info.str, {
          format: 'EAN13', // 条码类型
          lineColor: '#000', // 线条颜色
          width: 2,  // 间隔宽度
          height: 80, // 图片高度
          margin: 5,
          fontSize: 36, // 字体大小
          displayValue: true, // 是否显示条码下方的数字
        })
      })
    },
}
</script>

样例:

image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容