一、简介

非常实用的一个工具，几行代码帮助我们生成条形码。

官网：https://lindell.me/JsBarcode/

二、使用

1、安装

npm install jsbarcode --save

2、引入项目中

import JsBarcode from "jsbarcode"

3、使用

JsBarcode("#barcode", "1234567890", {format: "CODE128", //选择要使用的条形码类型width: 2, //设置条之间的宽度height: 40, //高度displayValue: true, //是否在条形码下方显示文字textAlign: "center", //文字所在位置,默认中间text: "hello", //条形码下面显示的文本内容lineColor: "#000", //设置条和文本的颜色。
})

三、代码总览

所有内容写在同一个文件中

<template><div><img id="barcode" /></div>
</template><script>import JsBarcode from "jsbarcode"export default {name: "App",components: {},mounted() {JsBarcode("#barcode", "1234567890", {format: "CODE128", //选择要使用的条形码类型width: 2, //设置条之间的宽度height: 40, //高度displayValue: true, //是否在条形码下方显示文字textAlign: "center", //文字所在位置,默认中间text: "hello", //条形码下面显示的文本内容lineColor: "#000", //设置条和文本的颜色。})},}
</script><style></style>

四、效果展示