vuejs生成条形码（barcode）的方法

vuejs如何生成条形码，下面编程教程网小编给大家简单介绍一下几种不同的方法！

安装脚手架

npm install jsbarcode --save

在需要的项目中引入

import JsBarcode from "jsbarcode"

使用方法

//输入内容
<el-input v-model="value" placeholder="请输入需要生成的内容" clearable></el-input>

//生成条形码
<img ref="qrCodeDiv"/>

JsBarcode(this.$refs.qrCodeDiv, this.value, {
  format: "CODE128", //条形码的格式
  width: 1, //线宽
  height: 100, //条码高度
  lineColor: "#000", //线条颜色
  displayValue: true, //是否显示文字
  margin: 2 //设置条形码周围的空白区域
});

注意：如果页面报”InvalidElementException: Not supported type to render on”错误，查看一下条形码输出是不是img格式！

以上是编程学习网小编为您介绍的“vuejs生成条形码（barcode）的方法”的全面内容，想了解更多关于 vuejs 内容，请继续关注编程基础学习网。