Syncfusion的新JavaScript条形码生成器控件
Syncfusion的Web（Essential JS 2）平台中包含一个新的、功能强大的纯JavaScript条形码生成器控件。这种条形码生成器控制重量轻、易于使用、易于集成。它可以使用JavaScript创建和显示行业标准的一维条形码、Data Matrix条形码和QR码，生成的条形码针经过优化，可用于打印和屏幕扫描。该控件可与其他第三方Web框架（如Angular、React和Vue.js）互操作。
专注于为中小企业提供网站制作、成都网站设计服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业安仁免费做网站提供优质的服务。我们立足成都，凝聚了一批互联网行业人才，有力地推动了上千多家企业的稳健成长，帮助中小企业通过网站建设实现规模扩充和转变。
JavaScript条形码生成器控件主要特点：
如何使用Syncfusion的新JavaScript条形码生成器控件生成一维或线性条形码、Data Matrix条形码和QR码呢？请继续往下看吧~
生成1D或线性条形码
克隆项目并使用以下命令安装必要的包：
git clone https://github.com/syncfusion/ej2-quickstart.git quickstart
cd quickstart
npm install
必须在system.config.js 配置文件中映射从属软件包。
System.config({
paths: {
'syncfusion:': './node_modules/@syncfusion/',
},
map: {
app: 'app',
//Syncfusion packages mapping
"@syncfusion/ej2-base": "syncfusion:ej2-base/dist/ej2-base.umd.min.js",
"@syncfusion/ej2-barcodegenerator": "syncfusion:ej2-barcodegenerator/dist/ej2- barcodegenerator.umd.min.js",
},
packages: {
'app': { main: 'app', defaultExtension: 'js' }
}
});将条形码的HTML div元素添加到index.html。[SRC / index.html中]
然后通过在app.ts [src/app/app.ts]中指定条形码类型、值等来实例化条形码生成器。以下代码示例将生成Code 128条形码：
import { BarcodeGenerator } from '@syncfusion/ej2-barcode-generator';
/**
* Initialize the barcode
*/
let barcode: BarcodeGenerator = new BarcodeGenerator({
width: '200px',
height: '150px',
// Define the type of the barcode
type: 'Code128',
// Define the value for the barcode to generate
value: 'SYNCFUSION',
});
barcode.appendTo('#barcode');运行以下命令以启动该应用程序：
生成的Code 128条形码将类似于以下条形码：
生成QR码
以下代码示例说明了如何创建QR代码：
/*[src/app/app.ts] */
import { QRCodeGenerator } from '@syncfusion/ej2-barcode-generator';
/**
* Initialize the QRCode Generator
*/
let barcode: QRCodeGenerator = new QRCodeGenerator({
width: '200px',
height: '150px',
value: 'SYNCFUSION',
});
barcode.appendTo('#barcode');生成的QR码将如下图所示：
生成数据矩阵
您可以使用以下代码示例创建Data Matrix条形码：
/*[src/app/app.ts] */
import { DataMatrixGenerator} from '@syncfusion/ej2-barcode-generator';
/**
* Initialize the Data Matrix Generator
*/
let barcode: DataMatrixGenerator = new DataMatrixGenerator({
height: 150,
width: 200,
value: 'SYNCFUSION'
});
barcode.appendTo('#barcode');以下是生成的Data Matrix条形码的屏幕截图：
此条形码生成器控件旨在实现高度可定制。
本文名称：Syncfusion的新JavaScript条形码生成器控件
URL分享：
http://www.cdkjz.cn/article/jjphcg.html
