私の要件は、ループ内で複数の検証コードを生成することであり、各検証コードには独自の文字列情報があります。これは単に QR コードを生成するのではなく、情報を提供することを目的としていますが、WeChat アプレットは QR コードを生成するための対応するインターフェイスを提供していないことに注意してください。
以下に 2 つの解決策を示します。
解決策 1: weapp.qrcode ライブラリを使用する
github アドレス: GitHub - yingye/weapp-qrcode: weapp.qrcode.js WeChat アプレットで QR コードをすばやく生成
この方法も可能ですが、QR コードの生成にのみ適しています。複数の QR コードを生成し、画面を上下にスクロールしてプレビューする必要がある場合、次の問題が発生します。
見てください、下部のコンテンツの一部が覆われていますが、その理由は、WeChat ネイティブ アプレットのキャンバス レイヤーが高すぎるためで、Z インデックスを調整しても役に立ちません。したがって、weapp.qrcode は、単一の QR コードを生成するアプリケーション シナリオにのみ適しています。
解決策 2: QRCodes.js プラグインを使用する
この方法の利点は、高レベルのネイティブ キャンバスの問題を回避し、代わりに単純にイメージを使用できることです。
js ライブラリのアドレスは次のとおりです: https://files.cnblogs.com/files/RVon/QRCodes.js
1. QRCode.js を utils フォルダーに置きます。
2. js ファイルの最後に、QR コードを生成する createQrCodeImg メソッドが外部に提供されていることがわかります。
module.exports = {
createQrCodeImg: createQrCodeImg
};
3. 対応するページの js ファイルで QRCode.js を参照します。
var QR = require(\'../../utils/QRCode\')
4. メソッド内で QR.createQrCodeImg() メソッドを呼び出します。
var imgData = QR.createQrCodeImg(\'123\')
ここでの imgData は、base64 形式で生成された QR コードであり、img に直接入れて使用できます。
効果は次のとおりです。
この要件に一日のほとんどを悩まされましたが、最終的には非常に簡単に実行できました。役に立ったら小指を動かして「いいね！」してください