Preface: I met a demand at work. I need to check the progress of filling in the information. The filling process is only completed in the browser on the PC side, but my boss insisted that I add a mobile phone scan code to check the filling. When I put forward this demand, I directly denied it and asked him: why do I have to pick up my mobile phone to scan a TWO-DIMENSIONAL code when I fill out the application on the computer? Boss: I don’t care. I want it. Dude, I’m just a dude. It’s up to you. You’re the boss.

Qr code

1. What is qr code

Two-dimensional bar code (2-dimensional bar code) is a black and white graphic that records data symbol information distributed in the plane (two-dimensional direction) according to a certain law with a specific geometric figure. On the compiled code clever use of which form the basis of computer internal logic “0”, the concept of “1” bit stream, using a number of corresponding to the binary numerical information, geometric shapes to represent text automatically recognized by image input device or photoelectric scanning equipment in order to realize the automatic information processing: some common: it has a barcode for each code system has its particular character set; Each character occupies a certain width; Has a certain calibration function. At the same time, it also has the function of automatic recognition of different lines of information, and processing of graph rotation change point.

QRCode.js

1. What is qrcode.js?

Qrcode.js is a JavaScript library for generating QR codes. Mainly through the acquisition of DOM tags, and then through HTML5 Canvas drawing, does not rely on any library.

2. The introduction of

I’m using this qrcode.js package for my project, but it’s written the same way. (Mainly because of the number of downloads, I chose this one)

import QRCode from “qrcodejs2”;

Use 3.

First, you need a container to hold the QR code

<div ref="qrCode" :style={'width':'100px', 'height':'100px'} ></div>
Copy the code

Second, the QRCode is generated by calling qrcode.js

Var qrcode = new qrcode (this.$refs.qrCodeUrl, {text: "XXX ", // XXX is the link to generate the qrcode; width: 100, height: 100, colorDark: "#000000", colorLight: "#ffffff", correctLevel: QRCode.CorrectLevel.H }Copy the code

Or, you’ll need to clear the QR code you generated earlier

qrcode.clear();
Copy the code

Or, you can generate another QR code

qrcode.makeCode("xxx"); // XXX sets the link to generate the QR codeCopy the code

At the end

Above is using QrCodeJS to generate two-dimensional code. Finally, I wish the big handsome bibi and the big beauties all their wishes come true