weapp qrcode Download - weapp qrcode Quellcode herunterladen

weapp qrcode

AI-Quellcode

1.0.0

Herunterladen

weapp-qrcode

weapp.qrcode.js generiert schnell QR-Codes in WeChat-Miniprogrammen

Verwendung

Erstellen Sie zunächst canvas zum Zeichnen in der WXML-Datei und definieren Sie width , height und canvasId .

 < canvas style =" width: 200px; height: 200px; " canvas-id =" myQrcode " > </ canvas >

Importieren Sie die js-Datei direkt und zeichnen Sie den QR-Code mit drawQrcode() . !!!Bevor Sie die Methode drawQrcode() aufrufen, stellen Sie sicher, dass Sie canvas context abrufen.

In der Version v0.6.0 werden mehrere Dateien erstellt. Weitere Informationen finden Sie in der Beschreibung der Build-Dateien.

 // 将 dist 目录下，weapp.qrcode.esm.js 复制到项目目录中
import drawQrcode from '../../utils/weapp.qrcode.esm.js'

drawQrcode ( {
  width : 200 ,
  height : 200 ,
  canvasId : 'myQrcode' ,
  // ctx: wx.createCanvasContext('myQrcode'),
  text : 'https://github.com/yingye' ,
  // v1.0.0+版本支持在二维码上绘制图片
  image : {
    imageResource : '../../images/icon.png' ,
    dx : 70 ,
    dy : 70 ,
    dWidth : 60 ,
    dHeight : 60
  }
} )

Wenn das Projekt das Wepy-Framework verwendet, können Sie das Paket weapp-qrcode npm direkt installieren.

 npm install weapp-qrcode --save

 import drawQrcode from 'weapp-qrcode'

drawQrcode ( {
  width : 200 ,
  height : 200 ,
  canvasId : 'myQrcode' ,
  text : 'https://github.com/yingye'
} )

DEMO

Weitere Demos finden Sie im Beispielverzeichnis. Beispiele hierfür sind native Syntax und WePY-, mpvue- und Taro-Frameworks.

API

drawQrcode([Optionen])

Optionen

Typ: Objekt

Parameter	veranschaulichen	Beispiel
Breite	Die Breite des QR-Codes muss mit `width` `canvas` übereinstimmen	200
Höhe	Die Höhe des QR-Codes muss mit `height` `canvas` übereinstimmen.	200
CanvasId	Optional, `canvasId` zum Zeichnen	`'myQrcode'`
ctx	Optionaler Zeichnungskontext kann über `wx.createCanvasContext('canvasId')` abgerufen werden, unterstützt von Version v1.0.0+	`'wx.createCanvasContext('canvasId')'`
Text	Erforderlicher QR-Code-Inhalt	'https://github.com/yingye'
typeNumber	Optional, QR-Code-Berechnungsmodus, Standardwert -1	8
rightLevel	Optional, QR-Code-Fehlerkorrekturstufe, der Standardwert ist erweitert, Werte: `{ L: 1, M: 0, Q: 3, H: 2 }`	1
Hintergrund	Optional, Hintergrundfarbe des QR-Codes, Standardwert ist Weiß	`'#ffffff'`
Vordergrund	Optional, Vordergrundfarbe des QR-Codes, Standardwert ist Schwarz	`'#000000'`
_Das	Nicht erforderlich. Bei Verwendung in einer Komponente muss es übergeben werden. Unterstützt von Version v0.7.0+	Das
Rückruf	Optionale Rückruffunktion nach Abschluss des Zeichnens, unterstützt von Version v0.8.0+. Kompatibilitätsprobleme mit Android-Telefonen können gelöst werden, indem Sie den Timer selbst einstellen. Weitere Informationen finden Sie unter Problem Nr. 18	`function (e) { console.log('e', e) }`
X	Optional ist die Startposition der x-Achse für die QR-Code-Zeichnung. Der Standardwert ist 0 und wird von der Version v1.0.0+ unterstützt	100
j	Optional ist die Startposition der y-Achse für die QR-Code-Zeichnung. Der Standardwert ist 0 und wird von der Version v1.0.0+ unterstützt	100
Bild	Es ist nicht erforderlich, Bilder auf Leinwand zu zeichnen. Die Ebene ist höher als der QR-Code . Weitere Informationen finden Sie unter drawImage.	`{ imageResource: '', dx: 0, dy: 0, dWidth: 100, dHeight: 100 }`